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

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 , 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.

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

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
> , 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.

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

"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

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

Michael wrote:
> Since I don't have IE6 on this computer

why?
http://tredosoft.com/Multiple_IE

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

"G" <.@.> wrote in message news:46bcb641$0$14067$742ec2ed@news.sonic.net...
> 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 :)

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

"Michael" wrote in message news:46bc7006$0$234$e4fe514c@news.xs4all.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 , 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

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

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: