Closet Philosopher
03-25-05, 09:13 PM
I'm making a web page for my school. I have all of the code worked out and elements set up. I'll be done soon. I have a problem though. I am doing a style of page that a friend suggested where the page is contained inside a table. I thought it could be cool, so I tryed it out. The page looks fine in Dreamweaver (aside from some slight glitches of beta graphics) but when I preview it in a browser, there is a space between the images that are supposed to connect. I'll post two screendhots and you'll understand the problem more. The first screen is what I see in Dreamweaver and the second page is what I see in Internet Explorer (I never use that program, but I test my pages in it because it's the most popular browser).
Dreamweaver
http://img203.exs.cx/img203/9708/webpage0mj.jpg
Explorer
http://img203.exs.cx/img203/2338/explorerpage0tm.jpg
Any ideas?
sargentlard
03-25-05, 10:11 PM
<marquee>Try going over the raw html itself. Dreamweaver or any web authoring program isn't perfect. You probably have extra stuff you don't need or a character out of place.</marquee>
Voodoo Child
03-26-05, 02:46 AM
It might be the browser itself. I have encountered the same problem several times. In one instance, it fixed itself with a refresh.
It can be fixed in several ways. Use of styles resolves the problem quite well because they give you more explicit control and dodge browser specific rendering problems. Try style = "spacing: none; padding: none; border: none; border-collapse:collapse". in the table tag. Also, see if there are any spaces/chars floating about.
Another solution is to put the title bit in its own table. Don't ask me why this sometimes works. You can track down what is giving you the extra pixel by changing the background color
The sidebar, incidentally, should be a smaller image vertically tiled(if it isn't) to load quicker.
Stryder
03-26-05, 10:50 AM
If you don't want to use the STYLE method (which is compatible with most browsers nowadays) you can achieve the same with these entries in your TABLE tag.
VSPACE="0" HSPACE="0" CELLPADDING="0" CELLSPACING="0"
What they are:
VSPACE is extra space in pixels above and below table perimeter.
HSPACE is extra space in pixels left and right of table perimeter.
CELLPADDING is space in pixels between TABLE CELLS and their content.
CELLSPACING is space in pixels between CELLS.
Note:
If you use a text entry box in any form within your template design, you will find that Firefox and other Mozilla browsers will follow the design more tightly than Internet Explorer that usually places a space underneath the box which will knock your skin out of alignment.
If you use an A (Anchor) TAG to surround an IMG, you will find that the link will cause a line to "Border" your image. To remove that just insert into your IMG tag.
BORDER="0"