hey guys... helping a buddy design a site in CSS, looks ok in Firefox but for some reason the logo image doesn't even display in IE any idea why this would be ? ? #logo { float: left; padding-top: 80px; background: url(images/eglobal.jpg); } #logo h1, #logo h2 { margin: 0; padding-left: 200px; font-weight: normal; color: #E06529; site is : e-globalmedia.com THX
http://jigsaw.w3.org/css-validator/...lt.css&warning=1&profile=css21&usermedium=all That's odd. It 100% passes CSS validation. Sniff the traffic, and see if the image is even getting called, and report back?
from what i can see yes its getting called....damn this is f*cked up, been breaking my head over this all day...such a waste of time for such a small bit of code
ok i think it has something to do with the float cuz i commented it out and the image shows in IE but shows 4x accross the screen...is the float correct in this? #logo { float: left; padding-top: 80px; background: url(images/eglobal.jpg);
You aren't declaring a height, IE has a quirk where no height = no content, even though padding SHOULD be counted as height. Change that padding:80px to height:80px and see if that does the trick. You are also probably seeing the minimum height bug, but it's hard to say with all that unused/wasted HTML and CSS in there. We're talking at least one level of wasted DIV container per item, those empty H1 and H2 tags are accomplishing a whole lot (when the image itself should probably be a image replacement ON the h1), etc, etc. I'd probably strip a third to half the HTML out of there given the simplicity of the layout.
changing to height did not make it work but thx for your input...I just inserted the image in the H1 tag works fine now
And background: url('images/eglobal.jpg') isn't right either. I think it works, but according to specs the quotes are not needed.