image spacing in html/css

Status
This thread has been Locked and is not open to further replies. Please start a New Thread if you're having a similar issue. View our Welcome Guide to learn how to use this site.

tnxiong

Thread Starter
Joined
Sep 28, 2008
Messages
5
I'm having trouble eliminating spaces between images in IE 7. It works fine
in Firefox. In IE7, it just seems to be leaving little spaces between images top, bottom, right, and left. I've set cellpadding, etc.. all to 0's already as well. What can be the problem?
 

tomdkat

Retired Trusted Advisor
Joined
May 6, 2006
Messages
7,148
Could you post the HTML for the page here or can you post a link to the site so we can see what's up?

Peace...
 

tnxiong

Thread Starter
Joined
Sep 28, 2008
Messages
5
This is a one of the tables I have.
It works fine in Firefox, but in IE 7, the images are has a space in between.

............<table width="652" height="347" border="0" cellpadding="0" cellspacing="0">
<tr border="0" cellspacing="0" cellpadding="0">
<td border="0" cellspacing="0" cellpadding="0">
<a href="biography.html"
onmouseover="javascript:moveIn2('thai', 'images/xingdesign_01.jpg', 'bio', 'images/buttonsxingdesignx_08.jpg')"
onmouseout="javascript:moveOut2('thai', 'images/redxingdesignx_01.jpg', 'bio', 'images/redxingdesignx_08.jpg')"
target="_blank">
<img border="0" src="images/redxingdesignx_01.jpg" name="thai" alt="thai"/></a>

<a href="test.html"
onmouseover="javascript:moveIn2('D','images/xingdesign_06.jpg','links','images/buttonsxingdesignx_09.jpg')"
onmouseout="javascript:moveOut2('D','images/redxingdesignx_06.jpg','links','images/redxingdesignx_09.jpg')"
target="_blank">
<img border="0" src="images/redxingdesignx_06.jpg" name="D" alt="Desan"/></a>
</td>

<td border="0" cellspacing="0" cellpadding="0">
<a href="biography.html"
onmouseover="javascript:moveIn2('Don','images/xingdesign_02.jpg','testimonals','images/buttonsxingdesignx_11.jpg')"
onmouseout="javascript:moveOut2('Don','images/redxingdesignx_02.jpg','testimonals','images/redxingdesignx_11.jpg')"
target="_blank">
<img border="0" src="images/redxingdesignx_02.jpg" name="Don" alt="Don" /></a>

<a href="biography.html"
onmouseover="javascript:moveIn2('kids','images/xingdesign_05.jpg', 'contact', 'images/buttonsxingdesignx_10.jpg')"
onmouseout="javascript:moveOut2('kids','images/redxingdesignx_05.jpg', 'contact', 'images/xingdesign_10.jpg')"
target="_blank">
<img border="0" src="images/redxingdesignx_05.jpg" name="kids" alt="kids"/></a>

<a href="biography.html"
onmouseover="javascript:moveIn2('le','images/xingdesign_07.jpg', 'FAQ','images/buttonsxingdesignx_12.jpg')"
onmouseout="javascript:moveOut2('le','images/redxingdesignx_07.jpg', 'FAQ','images/redxingdesignx_12.jpg')"
target="_blank">
<img border="0" src="images/redxingdesignx_07.jpg" name="le" alt="le"/></a>
</td>
<td border="0" cellspacing="0" cellpadding="0">
<a href="biography.html"
onmouseover="javascript:moveIn('art','images/xingdesign_03.jpg')"
onmouseout="javascript:moveOut('art','images/redxingdesignx_03.jpg')"
target="_blank">
<img border="0" src="images/redxingdesignx_03.jpg" name="art" alt="art"/></a>
</td>
<td border="0" cellspacing="0" cellpadding="0">
<img border="0" src="images/redxingdesignx_04.jpg" name="xing" alt="Xing"/>
</td>
</tr>
</table>.................
 

tomdkat

Retired Trusted Advisor
Joined
May 6, 2006
Messages
7,148
Could you please post the HTML for the entire page or post a link to a live site?

Thanks!

Peace...
 

tnxiong

Thread Starter
Joined
Sep 28, 2008
Messages
5
Sorry about that. The site is not up and running yet. Here is the whole index.html page source code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<title>XingDesign</title>

<!-- <link href="style.css" rel="stylesheet" type="text/css" /> -->
<script language="JavaScript" src="dynamic.js"></script>



</head>

<body>

<input type="button" onclick="test()" value="Click Me!">


<div align="center" style="background-color: #00CC00; display:block" padding="0">
<table border="0" cellpadding="0" cellspacing="0">
<img border="0" style="margin: 100px 15px 10px 100px" src="images/redxingdesignx_06.jpg" />

<!-- <div border="0" style="border:1px solid black" style="background-color: #00FFFF">
<img border="0" src="images/redxingdesignx_06.jpg" />
</div>
(Margin, border, Padding, Element box)-->

</table>
</div>

<br/>

<div align="center" style="background-color: #00CC00"> <!-- style="background-color: #00CC00; text-align:center" -->
<table>
<table width="652" height="347" border="0" cellpadding="0" cellspacing="0">
<tr border="0" cellspacing="0" cellpadding="0">
<td border="0" cellspacing="0" cellpadding="0">
<a href="biography.html"
onmouseover="javascript:moveIn2('thai', 'images/xingdesign_01.jpg', 'bio', 'images/buttonsxingdesignx_08.jpg')"
onmouseout="javascript:moveOut2('thai', 'images/redxingdesignx_01.jpg', 'bio', 'images/redxingdesignx_08.jpg')"
target="_blank">
<img border="0" src="images/redxingdesignx_01.jpg" name="thai" alt="thai"/></a>

<a href="test.html"
onmouseover="javascript:moveIn2('D','images/xingdesign_06.jpg','links','images/buttonsxingdesignx_09.jpg')"
onmouseout="javascript:moveOut2('D','images/redxingdesignx_06.jpg','links','images/redxingdesignx_09.jpg')"
target="_blank">
<img border="0" src="images/redxingdesignx_06.jpg" name="D" alt="Desan"/></a>
</td>

<td border="0" cellspacing="0" cellpadding="0">
<a href="biography.html"
onmouseover="javascript:moveIn2('Don','images/xingdesign_02.jpg','testimonals','images/buttonsxingdesignx_11.jpg')"
onmouseout="javascript:moveOut2('Don','images/redxingdesignx_02.jpg','testimonals','images/redxingdesignx_11.jpg')"
target="_blank">
<img border="0" src="images/redxingdesignx_02.jpg" name="Don" alt="Don" /></a>

<a href="biography.html"
onmouseover="javascript:moveIn2('kids','images/xingdesign_05.jpg', 'contact', 'images/buttonsxingdesignx_10.jpg')"
onmouseout="javascript:moveOut2('kids','images/redxingdesignx_05.jpg', 'contact', 'images/xingdesign_10.jpg')"
target="_blank">
<img border="0" src="images/redxingdesignx_05.jpg" name="kids" alt="kids"/></a>

<a href="biography.html"
onmouseover="javascript:moveIn2('le','images/xingdesign_07.jpg', 'FAQ','images/buttonsxingdesignx_12.jpg')"
onmouseout="javascript:moveOut2('le','images/redxingdesignx_07.jpg', 'FAQ','images/redxingdesignx_12.jpg')"
target="_blank">
<img border="0" src="images/redxingdesignx_07.jpg" name="le" alt="le"/></a>
</td>
<td border="0" cellspacing="0" cellpadding="0">
<a href="biography.html"
onmouseover="javascript:moveIn('art','images/xingdesign_03.jpg')"
onmouseout="javascript:moveOut('art','images/redxingdesignx_03.jpg')"
target="_blank">
<img border="0" src="images/redxingdesignx_03.jpg" name="art" alt="art"/></a>
</td>
<td border="0" cellspacing="0" cellpadding="0">
<img border="0" src="images/redxingdesignx_04.jpg" name="xing" alt="Xing"/>
</td>
</tr>
</table>


<table width="652" hight="115" align="center" border="0" cellspacing="0" cellpadding="0">
<tr>

<td border="0" cellspacing="0" cellpadding="0">
<a href=""
onmouseover="javascript:moveIn2('thai', 'images/xingdesign_01.jpg', 'bio', 'images/buttonsxingdesignx_08.jpg')"
onmouseout="javascript:moveOut2('thai', 'images/redxingdesignx_01.jpg', 'bio', 'images/redxingdesignx_08.jpg')"
target="_blank">
<img border="0" src="images/xingdesign_08.jpg" name="bio" alt="Bio" /></a>

</td>
<td border="0" cellspacing="0" cellpadding="0">
<a href=""
onmouseover="javascript:moveIn2('D','images/xingdesign_06.jpg','links','images/buttonsxingdesignx_09.jpg')"
onmouseout="javascript:moveOut2('D','images/redxingdesignx_06.jpg','links','images/redxingdesignx_09.jpg')"
target="_blank">
<img border="0" src="images/xingdesign_09.jpg" name="links" alt="Links"/></a>
</td>
<td border="0" cellspacing="0" cellpadding="0">
<a href=""
onmouseover="javascript:moveIn2('kids','images/xingdesign_05.jpg', 'contact', 'images/buttonsxingdesignx_10.jpg')"
onmouseout="javascript:moveOut2('kids','images/redxingdesignx_05.jpg', 'contact', 'images/xingdesign_10.jpg')"
target="_blank">
<img border="0" src="images/xingdesign_10.jpg" name="contact" alt="Contact"/></a>
</td>
<td border="0" cellspacing="0" cellpadding="0">
<a href=""
onmouseover="javascript:moveIn2('Don','images/xingdesign_02.jpg', 'testimonals','images/buttonsxingdesignx_11.jpg')"
onmouseout="javascript:moveOut2('Don','images/redxingdesignx_02.jpg', 'testimonals','images/redxingdesignx_11.jpg')"
target="_blank">
<img border="0" src="images/xingdesign_11.jpg" name="testimonals" alt="Testimonals" /></a>

</td>
<td border="0" cellspacing="0" cellpadding="0">
<a href=""
onmouseover="javascript:moveIn2('le','images/xingdesign_07.jpg', 'FAQ','images/buttonsxingdesignx_12.jpg')"
onmouseout="javascript:moveOut2('le','images/redxingdesignx_07.jpg','FAQ','images/redxingdesignx_12.jpg')"
target="_blank">
<img border="0" src="images/xingdesign_12.jpg" name="FAQ" alt="FAQ" /></a>
</td>


</tr>
</table>


<table width="652" align="center" border="0" cellspacing="0" cellpadding="0"> <!-- bgcolor="#000000" -->
<tr>
<td border="0" cellspacing="0" cellpadding="0"><a href="xingdesignxgraphicdesign.html"><img border="0" src="images/xingdesign_13.jpg" alt="grafx arts" width="134" /></a></td>
<td border="0" cellspacing="0" cellpadding="0"><a href="xingdesignxphotohopmedia.html"><img border="0" src="images/xingdesign_14.jpg" alt="photoshop media" width="170" /></a></td>
<td border="0" cellspacing="0" cellpadding="0"><a href="xingdesignxphotography.html"><img border="0" src="images/xingdesign_15.jpg" alt="photography" width="145" /></a></td>
<td border="0" cellspacing="0" cellpadding="0"><a href="xingdesignxfinearts.html"><img border="0" src="images/xingdesign_16.jpg" alt="finearts" width="83" /></a></td>
<td border="0" cellspacing="0" cellpadding="0"><a href="xingdesignxwebdesign.html"><img border="0" src="images/xingdesign_17.jpg" alt="webdesign" width="112" /></a></td>
<td border="0" cellspacing="0" cellpadding="0"><a href="xingdesignxvideography.html"><img border="0" src="images/xingdesign_18.jpg" alt="videography" width="133" /></a></td>
<td border="0" cellspacing="0" cellpadding="0"><img border="0" src="images/xingdesign_19.jpg" width="247" height="27" alt="blank" /></td>

</tr>
</table>


<table width="652" align="center" border="0" cellspacing="0" cellpadding="0">
<tr border="0" cellspacing="0" cellpadding="0">
<td border="0" cellspacing="0" cellpadding="0"><img border="0" src="images/xingdesign_20.jpg" width="1024" height="165" alt="blank" /></td>
</tr>
</table>


</table>
</div>



</body>




</html>
 

tomdkat

Retired Trusted Advisor
Joined
May 6, 2006
Messages
7,148
Thanks. Which images have spaces in between them that you don't want?

EDIT: Better yet, since the site isn't live yet can you post a screenshot of how it looks in Firefox?

Peace...
 
Status
This thread has been Locked and is not open to further replies. Please start a New Thread if you're having a similar issue. View our Welcome Guide to learn how to use this site.

Users Who Are Viewing This Thread (Users: 0, Guests: 1)

As Seen On
As Seen On...

Welcome to Tech Support Guy!

Are you looking for the solution to your computer problem? Join our site today to ask your question. This site is completely free -- paid for by advertisers and donations.

If you're not already familiar with forums, watch our Welcome Guide to get started.

Join over 807,865 other people just like you!

Latest posts

Staff online

Top