IE6: 1% is more than 1/100 body width?

Discussion in 'HTML' started by Michael, Aug 10, 2007.

  1. Michael

    Michael Guest

    Hi,

    I ran into this very odd problem today.
    I have a content div, which is 60% wide with 20% on each side. In the left
    20% I want to float a menu. An example is at
    http://dev.terrabulgaria.com/test.html
    In FireFox 2.0 this works exactly as expected. Same in IE7, except for a
    horizontal scrollbar at the bottom, which can be used to view just some
    extra whitespace. But in IE6, there is a major problem. The contents div is
    shown nicely in place, but the float is placed all the way to the right,
    with a left margin of about 110%, though the width seems to be correct.
    It seems to me, that IE6 thinks that a percent is much more than it actually
    is.
    I have a similar problem at http://dev.terrabulgaria.com/Over_Ons with a
    right float which is placed inside the red bordered center div, which I want
    to float in the right margin.

    I temporarily solved this by placing an extra stylesheet inside <!--[if lte
    IE 6]> -- load ie6hacks.css <![endif]-->, where ie6hacks.css basically
    overrides some margins with smaller values, but clearly this is not really
    what I want.
    Is this a bug in IE6, and can I solve this somehow without resorting to
    conditional CSS and the like?

    Thank you very much

    Kind regards

    Michael.
     
    Michael, Aug 10, 2007
    #1
    1. Advertising

  2. Michael

    Neredbojias Guest

    Well bust mah britches and call me cheeky, on Fri, 10 Aug 2007 14:02:44
    GMT Michael scribed:

    > Hi,
    >
    > I ran into this very odd problem today.
    > I have a content div, which is 60% wide with 20% on each side. In the
    > left 20% I want to float a menu. An example is at
    > http://dev.terrabulgaria.com/test.html
    > In FireFox 2.0 this works exactly as expected. Same in IE7, except for
    > a horizontal scrollbar at the bottom, which can be used to view just
    > some extra whitespace. But in IE6, there is a major problem. The
    > contents div is shown nicely in place, but the float is placed all the
    > way to the right, with a left margin of about 110%, though the width
    > seems to be correct. It seems to me, that IE6 thinks that a percent is
    > much more than it actually is.
    > I have a similar problem at http://dev.terrabulgaria.com/Over_Ons with
    > a right float which is placed inside the red bordered center div,
    > which I want to float in the right margin.
    >
    > I temporarily solved this by placing an extra stylesheet inside
    > <!--[if lte IE 6]> -- load ie6hacks.css <![endif]-->, where
    > ie6hacks.css basically overrides some margins with smaller values, but
    > clearly this is not really what I want.
    > Is this a bug in IE6, and can I solve this somehow without resorting
    > to conditional CSS and the like?


    A "sorta fix" would be to change margin-left:50% to padding-left:50%.

    --
    Neredbojias
    Half lies are worth twice as much as whole lies.
     
    Neredbojias, Aug 10, 2007
    #2
    1. Advertising

  3. Michael

    Michael Guest

    "Neredbojias" wrote in message
    news:Xns998867969FD9Ananopandaneredbojias@198.186.190.161...
    > Well bust mah britches and call me cheeky, on Fri, 10 Aug 2007 14:02:44
    > GMT Michael scribed:
    >
    >> I have a content div, which is 60% wide with 20% on each side. In the
    >> left 20% I want to float a menu. An example is at
    >> http://dev.terrabulgaria.com/test.html
    >> But in IE6, there is a major problem. The
    >> contents div is shown nicely in place, but the float is placed all the
    >> way to the right, with a left margin of about 110%, though the width
    >> seems to be correct.

    >
    >A "sorta fix" would be to change margin-left:50% to padding-left:50%.


    Well, if I'd even call it a fix it would be a very restrictive one at the
    least.
    Padding would create the white-space inside the box, which would not allow
    me to set the border, nor the background-color.
    Since I don't have IE6 on this computer (hooray for pre-installed Vista) I
    can't test if padding instead of margin would work; I could use the
    conditional CSS thing to make a borderless backgroundless padded version for
    IE6 users and the "normal" good-looking version for everyone else. I'm not
    thrilled at that idea though.

    But thanks anyway for the suggestion.

    Regards

    Michael
     
    Michael, Aug 10, 2007
    #3
  4. Michael

    G Guest

    G, Aug 10, 2007
    #4
  5. Michael

    Michael Guest

    "G" <.@.> wrote in message news:46bcb641$0$14067$...
    > Michael wrote:
    >> Since I don't have IE6 on this computer

    >
    > why?
    > http://tredosoft.com/Multiple_IE

    "The installer isn't working under Windows Vista. Mike posted a howto in the
    comments for running IE6 in Vista."
    Which comes down to : you just install a virtual machine that runs XP, and
    you can install IE6 on *that*.
    That's a little too much work, while I have access to a computer with IE6.

    That was not the problem though :)
     
    Michael, Aug 11, 2007
    #5
  6. Michael

    Michael Guest

    Re: 1% is more than 1/100 body width?

    "Michael" wrote in message news:46bc7006$0$234$4all.nl...
    > Hi,
    >
    > I ran into this very odd problem today.
    > I have a content div, which is 60% wide with 20% on each side. In the left
    > 20% I want to float a menu. An example is at
    > http://dev.terrabulgaria.com/test.html
    > In FireFox 2.0 this works exactly as expected. Same in IE7, except for a
    > horizontal scrollbar at the bottom, which can be used to view just some
    > extra whitespace. But in IE6, there is a major problem. The contents div
    > is shown nicely in place, but the float is placed all the way to the
    > right, with a left margin of about 110%, though the width seems to be
    > correct.
    > It seems to me, that IE6 thinks that a percent is much more than it
    > actually is.
    > I have a similar problem at http://dev.terrabulgaria.com/Over_Ons with a
    > right float which is placed inside the red bordered center div, which I
    > want to float in the right margin.
    >
    > I temporarily solved this by placing an extra stylesheet inside <!--[if
    > lte IE 6]> -- load ie6hacks.css <![endif]-->, where ie6hacks.css basically
    > overrides some margins with smaller values, but clearly this is not really
    > what I want.
    > Is this a bug in IE6, and can I solve this somehow without resorting to
    > conditional CSS and the like?
    >
    > Thank you very much
    >
    > Kind regards
    >
    > Michael.


    Hmm, it looks like I needed
    position: relative
    to fix most of my problems.
    Now I only need a few minor IE6 hacks and it's at least viewable.

    Thanks.

    Michael
     
    Michael, Aug 11, 2007
    #6
  7. Michael

    Martin Jay Guest

    On Fri, 10 Aug 2007 16:02:44 +0200, "Michael"
    <> wrote:
    >I ran into this very odd problem today.
    >I have a content div, which is 60% wide with 20% on each side. In the left
    >20% I want to float a menu. An example is at
    >http://dev.terrabulgaria.com/test.html
    >In FireFox 2.0 this works exactly as expected. Same in IE7, except for a
    >horizontal scrollbar at the bottom, which can be used to view just some
    >extra whitespace. But in IE6, there is a major problem. The contents div is
    >shown nicely in place, but the float is placed all the way to the right,
    >with a left margin of about 110%, though the width seems to be correct.
    >It seems to me, that IE6 thinks that a percent is much more than it actually
    >is.


    Silly IE. :)

    Perhaps you could look at the problem from a different viewpoint, and
    float the menu to the right and not give it a left margin. You will
    have to give it an outer DIV, though.

    CSS:

    ..menu {
    float: right;
    border: solid 1px blue;
    width: 50%;
    }

    HTML:

    <div style="float: left;">
    <div class="menu">
    Testing
    </div>
    </div>
    --
    Martin Jay
     
    Martin Jay, Aug 22, 2007
    #7
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Not4u
    Replies:
    9
    Views:
    1,045
    Not4u
    Feb 27, 2004
  2. Replies:
    8
    Views:
    6,696
    Neredbojias
    Dec 9, 2005
  3. Replies:
    7
    Views:
    183
    Tad McClellan
    Jun 22, 2006
  4. fred
    Replies:
    3
    Views:
    284
    Zifud
    Mar 17, 2005
  5. Replies:
    5
    Views:
    891
Loading...

Share This Page