Advertisement
If you have a new account but are having problems posting or verifying your account, please email us on hello@boards.ie for help. Thanks :)
Hello all! Please ensure that you are posting a new thread or question in the appropriate forum. The Feedback forum is overwhelmed with questions that are having to be moved elsewhere. If you need help to verify your account contact hello@boards.ie

Why does IE6 do this??

Options
  • 05-12-2005 10:08pm
    #1
    Closed Accounts Posts: 1,422 ✭✭✭


    Can somebody please tell me - is this a bug in IE6?

    http://www.siliconweb.ie/height/css_height.html

    A quick look at the source will reveal the blue div should only be 1px high. This works fine in FF. Is it a known bug in IE? The minimum height it will seem to display a div like this seems to be about 18px...

    Anybody got a workaround??

    Source (could hardly be simpler - if IE can't do this right, can it be trusted to do anything??):

    <html>
    <head>
    <title>test</title>
    <style type="text/css">
    #deco_bar {width: 100%; height: 1px; background: #000066;}
    </style>
    </head>

    <body>

    <div id="deco_bar"> </div>

    </body>
    </html>


Comments

  • Registered Users Posts: 999 ✭✭✭cregser


    Just for the heck of it. Try using class="deco_bar" instead of id="".


  • Closed Accounts Posts: 17,208 ✭✭✭✭aidan_walsh


    That won't work. The problem is because IE is rendering the space character at the full default font height. To fix it, set the font-size to 1px.


  • Registered Users Posts: 999 ✭✭✭cregser


    Ah Aidan, you're too fast :)

    #deco_bar {width: 100%; height: 1px; background: #000066; font-size: 1px;}


  • Closed Accounts Posts: 1,422 ✭✭✭rockbeer


    To fix it, set the font-size to 1px.

    Nice idea, thanks. It helped a bit... reduced it to about 14 px high :rolleyes:

    [edit]Oh... and it's the same with or without the space character. An empty div behaves just the same.[/edit]


  • Registered Users Posts: 8,488 ✭✭✭Goodshape


    It's line-height you need to set, not font-size.

    [html]
    <style type="text/css">
    #deco_bar {width: 100%; line-height : 1px; height: 1px; background: #000066;}
    </style>
    [/html]


  • Advertisement
  • Closed Accounts Posts: 17,208 ✭✭✭✭aidan_walsh


    Goodshape wrote:
    It's line-height you need to set, not font-size.

    [html]
    <style type="text/css">
    #deco_bar {width: 100%; line-height : 1px; height: 1px; background: #000066;}
    </style>
    [/html]
    D'oh...


  • Closed Accounts Posts: 1,422 ✭✭✭rockbeer


    Goodshape wrote:
    It's line-height you need to set, not font-size.

    That's sorted it. Nice one, thanks.

    Bruce


Advertisement