Previous Message
Next Message

white space in IE below <h3> with background image

Sent by Michael Landis on 4 February 2005 01:01


Bruce wrote:

> in my menu code I have:
>
> <div id="navcontainer-most-requested">
>   <h3>Most Requested</h3>
>     <ul class="navlist">
>       <li>content</li>
>       <li>content</li>
>       <li>content</li>
>       </ul>
>   </div>
>
> for my h3 css I have:
>
> #navcontainer-most-requested h3{
> background:url(/images/H3_Red.gif) top no-repeat;
> padding:0 0 0 20px;
> margin:0;
> font-family:Arial, Helvetica, sans-serif;
> color:#fff;
> font-weight:bold;
> font-size:85%;
> display: block;
> height:20px;
> }
>
> between my h3 image and the list below it, I am getting a bit (3 or 4
> pixels) of unwanted white space in IE.
>
> the image I am using as a background for the h3 is exactly 20pixels in
> height...

Hi, Bruce,

Not having the code I can't say for sure, but here are a couple of things
to check:

Is the white space coming from the h3 or the list? Try adding a contrasting
background color to the H3 and see if it appears below the image. If it is
in the h3, try setting the line-height to something less than or equal to
20px. Although the font may be small enough, perhaps the space it is given
is not. You may also want to see if there's a way to extend the image to
cover any extra space that might show up.

If the white space is coming from the list, you may want to zero the top
margins and paddings for the list items as well.

HTH,

Michael

______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Previous Message
Next Message

Message thread: