PDA

View Full Version : Trouble with eliminating space from between table rows! :)


3D_Dog_Man
07-14-2004, 01:57 AM
Hi Everyone,

I have written a page that presents a table inside a div tag. The table contained within the div tag is being used with some javascript to make a pop-up menu. Everything is working sweat, menu pops-up, etc, however I am not 100% satisfied with how the menu looks. I have white space between pictures that I am using in the table. Basically the table is made up of a seven rows, each containing one data cell. A picture is contained within each data cell. I cannot get rid of about 2mm of white space between the pictures! I have tried setting the table to use no border, 0 cellpadding and 0 cellspacing, all to no avail. Is there anything else that you could suggest I do in order to eliminate this really annoying white space? Thanks in advance for your help.

Regards

Davo

gohankid77
07-14-2004, 02:12 AM
try this:

<table style="margin:0px; padding:0px;" ....

Span
07-14-2004, 02:24 PM
Without your code it's hard to say, but I'm quite sure it's the images sitting on the baseline.

Try adding <img src="" width="" height="" alt="" style="display:block;" />,

Or, in your stylesheet, if you're using one, something like:

table td img {
display:block;
}

Or maybe, if you don't use CSS, align="bottom" in the img tags will help.

Edit: never use it anymore.. that should be valign..

m00nbeast
02-14-2006, 12:11 AM
I'm having the same problem

Can anyone help figure out why I cant get my images to sit flush against each other?


<html>
<title>menu 3</title>

<script type="text/javascript">
function change(id){
ID = document.getElementById(id);

if(ID.style.display == "")
ID.style.display = "none";
else
ID.style.display = "";
}
</script>


<body>
<table style="margin:0px; padding:0px;">
<tr>
<td title="Show/Hide" style="cursor: hand" onMouseOver="style.backgroundColor='#cecece';" onMouseOut="style.backgroundColor='#F3F3F3'" class="tbl"><a onclick="change(1)" href="#"><img src="support_button.jpg" border=0 width="" height="" alt="" style="display:block;" /></a></td>
</tr>

<!-- Sub menu 1 -->
<tr style="display: none" id="1">
<td class="tbl" style="background-color: #FFFFFF">
Sub 1
</td>
</tr>

<tr>
<td title="Show/Hide" style="cursor: hand" onMouseOver="style.backgroundColor='#cecece';" onMouseOut="style.backgroundColor='#F3F3F3'" class="tbl"><a onclick="change(2)" href="#"><img src="support_button.jpg" border=0 width="" height="" alt="" style="display:block;" /></a></td>
</tr>

<!-- Sub menu 2 -->
<tr style="display: none" id="2">
<td class="tbl" style="background-color: #FFFFFF">
Sub 2
</td>
</tr>
<tr>
<td title="Show/Hide" style="cursor: hand" onMouseOver="style.backgroundColor='#cecece';" onMouseOut="style.backgroundColor='#F3F3F3'" class="tbl"><a onclick="change(3)" href="#"><img src="support_button.jpg" border=0 width="" height="" alt="" style="display:block;" /></a></td>
</tr>
<!-- Sub menu 3 -->
<tr style="display: none" id="3">
<td class="tbl"style="background-color: #FFFFFF">
Sub 3
</td>
</tr>
</table>
</body>

</html>

m00nbeast
02-14-2006, 12:54 AM
oh it was the cellpadding and spacing needing to be zero! *slaps forehead*