Click to See Complete Forum and Search --> : Trouble With Spacing Table Rows
ClintAchilles
01-13-2007, 10:16 AM
I'm having a hard time trying to figure out how to elimate the space between vertical rows in my tables. The problem is that I want to stack pictures on top of one another as borderless links, but they always come out having blank space inbetween them. I want them to be connected completely with no spaces in a table format so that they are seperate from the rest of the page. If anyone could help me out, I'd appreciate it. Thank you.
WebJoel
01-13-2007, 11:01 AM
Okay, -using table, here is one possibility:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<title></title>
</head>
<body>
<table width="320">
<tr>
<td>
<img src="#" style="width:100px; height:100px; margin:0; padding:0; float: left;" /><img
src="#" style="width:100px; height:100px; margin:0; float:left;" /><img
src="#" style="width:100px; height:100px; margin:0; float: left;" />
<img src="#" style="width:100px; height:100px; margin:0; padding:0; float: left;" /><img
src="#" style="width:100px; height:100px; margin:0; float: left;" /><img
src="#" style="width:100px; height:100px; margin:0; float: left;" />
</td>
</tr>
</table>
</body>
</html>
NOTE how I wrote the layout:
<img src="#" style="width:100px; height:100px; margin:0; padding:0; float: left;" /><img
instead of:
<img src="#" style="width:100px; height:100px; margin:0; padding:0; float: left;" />
By 'starting the next tag without line-return', we prevent IE throwing the white-space bug, which 'assumes' a virtual line-return if we have a any space after the correct-closing of the tag before it.
This is not pretty to look at or read, and there are other 'prettier' ways to solve this IE-only error, but the results are a TABLE with IMAGES filling a TD, with NO 'whitespace' between any of the neighboring images.
This would work better not using TABLE layout, but this is what you asked for. :)