Dave M G wrote:

> I posted a few days ago about a problem where some images set as
> background images in <div> tags were not displaying in
> Internet Explorer version 7.
[...]
>
> The HTML is essentially just nested <div> tags:
> <div id="logo">
> <a href="/"><span>Articlass</span></a>
> <div id="logo-right">
> <div id="logo-left">
> <div id="main-menu">
> <?php menu("main_menu"); ?>
> </div><!-- ends main-menu -->
> </div><!-- ends logo-left -->
> </div><!-- ends logo-right -->
> </div><!--ends logo -->
>
> The tag "logo" has a background image that repeats. The "logo-left"
> <div> has a background - the main title text - that doesn't
> repeat and is positioned on the left. And, as expected,
> the "logo-right" <div> has
> a thin background, positioned on the right.


I'm not sure if the following is the only reason, but surely it contributes:

You have #logo-left { height: inherit; }
The inherit keyword is not supported by IE (IE7 included), so you are not
getting the desired height for your #logo-left.
Assign an explicit height, I think 180px is what you want (you can probably
also use height:100% on both #logo-right and #logo-left, since this is the
explicit height on the parent #logo.)

HTH,
Bruno

--
Bruno Fassino http://www.brunildo.org/test

______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- 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/

Reply via email to