ibn Ezra wrote: > On Aug 24, 2006, at 23:10 PM, ibn Ezra wrote: > >> Hi, >> I have two images stuffed inside a div that has a 4px border applied >> top and bottom: >> >> Page Example: >> http://covenantwoods.com/beta/index.php >> >> CSS: >> http://covenantwoods.com/beta/_stylesheets/base.css >> >> Looks as expected in Firefox 1.5 (Mac/Win), Opera 9 (Win), Safari 2 >> (Mac) and validates at W3C... but IE 6 is adding an extra 4px of >> whitespace between the bottom border and the images inside the div. >> I've been so busy learning the CSS standards that I haven't gotten my >> head around IE's particular way of looking at the CSS universe and >> I'm not sure where to begin looking. >> >> > > Hmm, > Well it's nice to know that I found my own answer to the problem! I > had a single space between the opening and closing brackets of the > div and the img link. Fixed! > > This: > <div id="banner"><img src="/beta/images/banner-a_home.jpg" alt="Image > of Couple" width="194" height="144" /><img src="/beta/images/banner- > b_home-us.jpg" alt="Image of Leaves" width="610" height="144" /></div> > > Instead of this: > <div id="banner"> <img src="/beta/images/banner-a_home.jpg" > alt="Image of Couple" width="194" height="144" /> <img src="/beta/ > images/banner-b_home-us.jpg" alt="Image of Leaves" width="610" > height="144" /></div> > > I thought that whitespace in the xhtml had no semantic meaning unless > it was either within a tag or inside quotes. What gives with IE 6? >
James, The gap probably occurred because images are inline content and sit on the baseline of their line box. Space can be seen beneath them to allow room for descenders of letters to display. Perhaps getting rid of the whitespace convinced IE that there would be no text in that box with the image and it was safe to let it sit on the bottom. The usual CSS fix for this problem is to apply either display: block or vertical-align: bottom to the images. See http://developer.mozilla.org/en/docs/Images,_Tables,_and_Mysterious_Gaps for more info on this. On a bit of list business, please be sure to trim quoted material to which you are not directly replying out of your replies to the list. This is required by the list policies. We'd also appreciate it if you refrained from top posting, as it disrupts the flow of conversation, but this is not required. I've taken the liberty of fixing both your quoting and posting order in my reply here. Thanks, Zoe -- Zoe M. Gillenwater Design Services Manager UNC Highway Safety Research Center http://www.hsrc.unc.edu ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
