Spacing in Tables

liunx

Guest
<!-- m --><a class="postlink" href="http://www.geocities.com/daub815/problem.html">http://www.geocities.com/daub815/problem.html</a><!-- m --><br />
The Link above is the Problem and below is what it is supposed to look like(Both are Just Pictures, which I cut up)<br />
<!-- m --><a class="postlink" href="http://www.geocities.com/daub815/test.htm">http://www.geocities.com/daub815/test.htm</a><!-- m --><br />
<br />
As you can see, there are black lines running between the different pictures. I have tried vspace and hspace within the <img> tag, but it does not do anything. If you could give me some ideas on what else I could try, that would be great. If you need the source or need me to explain more, just post a reply. Thanks!<!--content-->Try putting, cellspacing="0" and cellpadding="0" in the table tag.<br />
Nice design by the way.<br />
Also it may be better to stick to either .htm or .html with your page extensions, just for consistencies sake, so that you don't forget when creating links.<!--content-->http://www.geocities.com/daub815/manilla.htm<br />
Source Code link is above<br />
I should have added it earlier. I have the whole site layed out. Like I said before the spacing is really bad. Is there something in my source that caused it to do this. I double checked whether or not the images hade added space on the bottom, but they didn't. Thanks for your replies so far. I really appreciate the help.<!--content-->erm, have you seen that page, there aren't any images on it.<!--content-->Sorry, a lot of images. Took longer than expected. <br />
<!-- w --><a class="postlink" href="http://www.geocities.com/daub815/manilla.htm">www.geocities.com/daub815/manilla.htm</a><!-- w --><br />
Why are the black lines there?<!--content-->Look, I'm too tired to do much of anything right now but I've managed to sqeeze out this simple table example:<br />
<br />
<table cellspacing="0" cellpadding="0"><br />
<br />
<tr width="100" height="25"><br />
<td width="50" height="25"><br />
<br />
<img src=http://www.webdeveloper.com/forum/archive/index.php/"1.png" alt="1" width="50" height="25"><br />
<br />
</td><br />
<td width="50" height="25"><br />
<br />
<img src=http://www.webdeveloper.com/forum/archive/index.php/"2.png" alt="2" width="50" height="25"><br />
<br />
</td><br />
</tr><br />
<br />
</table><br />
<br />
This will put two images right next to each other with not even a pixel gap. However if you take away the cellpadding and cellspacing there is a gap. I hope this helps you.<!--content-->Thanks for the response. I'm sorry to say that the cellspacing and cellspadding are already set to 0. I wish this solved my problem, but it didn't. Thanks for helping.<!--content-->It looks like you've got another problem as well, in Opera there is no gap between the pics but take a look at this screenshot.<!--content-->And I don't know what Netscape is doing.<br />
<br />
If you upload that page and all of the images as a .zip here (If it's too big to up load here then upload it to goecities and provide a link) I'll have a play around with it and see what I come up with by tomorrow.<!--content-->Thanks for your help. I am going to keep on trying. The weird thing is that I have used this template before and it never gave me problems.<!--content-->Here's some things to check into even if they don't solve your problem. "overflow-x" and "overflow-y" are not legit CSS properties. "overflow" is. You can and should define boders, hspace, and vspace for images in your CSS. This would get rid of a bunch of code right there, and you can replace it with code saying what the height and wide of each image is. Your <tbody> tags aren't really doing anything for you, so you can get rid of those. I might weed through the code and see what I can come up with in terms of getting rid of you lines.<!--content-->also consider using an iframe not a layer or whatever you are doing now. An I frame can be a lot more convieniant because if you are only changing what is in that window then the user does not have to load that page all over again.<!--content-->
 
Back
Top