I have a simple div which holds an image with the dimensions 200px X 116px.
For some reason, this div is placing a bit of space (about 2-3pixels in height) below my image.
Heres the code:
#image {
width: 200px;
height: 116px;
padding: 0px;
margin: 0px;
border: 1px dashed;
}
And the html:
<div id="image"><img src=http://www.webdeveloper.com/forum/archive/index.php/"images/shockphoto_small.jpg" width="200" height="116" padding="0">
</div>
You can view this page here:
<!-- m --><a class="postlink" href="http://www.aloofhosting.com/shocktactics/test.htmIE">http://www.aloofhosting.com/shocktactics/test.htmIE</a><!-- m --> does odd things with whitespace in your code. Try putting the entire thing (Starting <div> tag, <img> tag, and ending <div> tag) on the same line.ah thanks Paul, thats a little bug i totally forgot about.
It fixed up the problem no worriesAlso, padding="0" is no good, so remove that... If you really feel you need it, throw it into a style...I think the real problem is that <img> is an inline tag and the real fix is to declare it display:block.Originally posted by pyro
Also, padding="0" is no good, so remove that... If you really feel you need it, throw it into a style... Not to mention it isn't even a valid attribute...Originally posted by ray326
I think the real problem is that <img> is an inline tag and the real fix is to declare it display:block.
No can do. Didn't work this time around.Originally posted by Paul Jr
No can do. Didn't work this time around. Oh well. I see that mis-rendering of white space by IE all the time, too. It makes for some rather ugly HTML working around it.Originally posted by ray326
Oh well. I see that mis-rendering of white space by IE all the time, too. It makes for some rather ugly HTML working around it.
Yeah, I've really never had a problem with it, since I usually deal in background images. Speaking of which, why not put this image as the <div>'s background? It'll prevent that little space, and you can slap some text in there, hidden by CSS, for those who have images disabled, or just for browsers/devices that don't have CSS enabled... or some such thing.yeh that sounds like a good idea. is it usually best, if for example you are using images to make up part of your design for a website, that they are placed as backgrounds of DIVs rather than have a DIV and then just place the image in that?
Does it make any difference? eg greater compatibility, faster loading, more efficient?
For some reason, this div is placing a bit of space (about 2-3pixels in height) below my image.
Heres the code:
#image {
width: 200px;
height: 116px;
padding: 0px;
margin: 0px;
border: 1px dashed;
}
And the html:
<div id="image"><img src=http://www.webdeveloper.com/forum/archive/index.php/"images/shockphoto_small.jpg" width="200" height="116" padding="0">
</div>
You can view this page here:
<!-- m --><a class="postlink" href="http://www.aloofhosting.com/shocktactics/test.htmIE">http://www.aloofhosting.com/shocktactics/test.htmIE</a><!-- m --> does odd things with whitespace in your code. Try putting the entire thing (Starting <div> tag, <img> tag, and ending <div> tag) on the same line.ah thanks Paul, thats a little bug i totally forgot about.
It fixed up the problem no worriesAlso, padding="0" is no good, so remove that... If you really feel you need it, throw it into a style...I think the real problem is that <img> is an inline tag and the real fix is to declare it display:block.Originally posted by pyro
Also, padding="0" is no good, so remove that... If you really feel you need it, throw it into a style... Not to mention it isn't even a valid attribute...Originally posted by ray326
I think the real problem is that <img> is an inline tag and the real fix is to declare it display:block.
No can do. Didn't work this time around.Originally posted by Paul Jr No can do. Didn't work this time around. Oh well. I see that mis-rendering of white space by IE all the time, too. It makes for some rather ugly HTML working around it.Originally posted by ray326 Oh well. I see that mis-rendering of white space by IE all the time, too. It makes for some rather ugly HTML working around it.
Yeah, I've really never had a problem with it, since I usually deal in background images. Speaking of which, why not put this image as the <div>'s background? It'll prevent that little space, and you can slap some text in there, hidden by CSS, for those who have images disabled, or just for browsers/devices that don't have CSS enabled... or some such thing.yeh that sounds like a good idea. is it usually best, if for example you are using images to make up part of your design for a website, that they are placed as backgrounds of DIVs rather than have a DIV and then just place the image in that?
Does it make any difference? eg greater compatibility, faster loading, more efficient?