img problem in IE
This code below works perfectly for all browsers except IE 7 or 8.
<img src="images/image1.png" usemap="#map1" width="669" height="300" border="0">
<map name="map1">
<area shape="rect" coords="80,120,182,226" href="XXXXX" target="_top" >
</map>
<div style="background : url(images/image2.png) repeat-y; height:auto; width:669px;">
<?
if ($count==0)
{
?>
table width="550">
tr>
td>
div >
center>
Sorry there is not information right now to show. <br/>
Please <a href="" target="_top">click here</a> to go to our home page.<center>
/div>
/td>
/tr>
/table>
?
}
else {}
/div>
img 开发者_如何学Pythonsrc="images/image3.png" width="669" >
in the CSS:
td {
vertical-align: top;
}
The problem in IE is that after image1.png i can a white space in between and the next image, image2.png is being shown after the blank white space. you can paste this code and check it yourself. I am not able to figure out why this is happening?
is there anyway where i can check if the browser is IE and if so, then push image2.png little upwards so that the blank space is covered? any suggestions?
Additional Info:
I do have another image, image3.png, but this image is not showing any blank spaces on loading.I tried to use jpg images but still the same.
Your IMG is an inline element and is implicitly inside a block. This block also contains some "text": the whitespace before the the DIV. Default vertical-align for the image is "baseline", so the whitespace that you see is the space under the baseline of text (the space where e.g. the the lower circle in letter "g" is).
To fix this, you have at least these options:
- Remove all whitespace between IMG and DIV (and perhaps put IMG within its own DIV)
- Set the style="vertical-align: bottom" on the IMG
try a negative margin-top?
The problem in IE is that after image1.png i can a white space in between and the next image
It could be that IE reserves space for the <map> element. Try placing the element elsewhere, it can be anywhere in the <body>.
加载中,请稍侯......
精彩评论