Trying out CS3 and it’s spry menu, I hit (apart from the
expected CS3 trouble)
on a very basic problem. On this page
http://www.ochrid.dds.nl/vlinderTest.htm
,
the container is set to a width of 80% and the left sidebar
to 24%. So I
thought I could set the width of the main container to 76%,
totalling 100 % of
the container.
Not so: IE7 is very tolerant, but FF pushed the mainContent
div down. Fixing
it’s width to 60% makes it allright in FF too, but surely
this is not an
elegant solution.
What is wrong with my resoning? (Once I have figured this
out, perhaps I’ll
figure out how to stretch the width of the menubar…)
–
Regards,
Adriana.
[ put out the rubbish if you need to reach me by e-mail ]
www.spinsister.nl
|||
> Trying out CS3 and it’s spry menu, I hit (apart from the
expected CS3
> trouble) on a very basic problem. On this page
>
http://www.ochrid.dds.nl/vlinderTest.htm
,
> the container is set to a width of 80% and the left
sidebar to 24%. So I
> thought I could set the width of the main container to
76%, totalling 100 %
> of the container.
> Not so: IE7 is very tolerant, but FF pushed the
mainContent div down. Fixing
> it’s width to 60% makes it allright in FF too, but
surely this is not an
> elegant solution.
> What is wrong with my resoning? (Once I have figured
this out, perhaps I’ll
> figure out how to stretch the width of the menubar…)
Is my question too stupid? I really want to know how I should
calculate the
width or whether the problem is elsewhere.
–
Regards,
Adriana.
[ put out the rubbish if you need to reach me by e-mail ]
www.spinsister.nl
|||
A.Translator wrote:
> What is wrong with my resoning? (Once I have figured
this out, perhaps
> I’ll figure out how to stretch the width of the
menubar…)
The 20px padding on #mainContent is added to width, causing
it to drop
down. Remove the padding and change the width to 75%, and it
comes back up.
When using percentage widths never use numbers that add up to
exactly
100, because rounding errors will often make your floats drop
down. Use
figures that add up to 98% or 99%.
–
David Powers, Adobe Community Expert
Author, “The Essential Guide to Dreamweaver CS3″ (friends of
ED)
Author, “PHP Solutions” (friends of ED)
http://foundationphp.com/
|||
>> What is wrong with my resoning? (Once I have figured
this out, perhaps I’ll
>> figure out how to stretch the width of the
menubar…)
> The 20px padding on #mainContent is added to width,
causing it to drop down.
> Remove the padding and change the width to 75%, and it
comes back up.
> When using percentage widths never use numbers that add
up to exactly 100,
> because rounding errors will often make your floats drop
down. Use figures
> that add up to 98% or 99%.
Thank you, David! Again.
–
Regards,
Adriana.
[ put out the rubbish if you need to reach me by e-mail ]
www.spinsister.nl
|||
A.Translator wrote:
> Thank you, David! Again.
My pleasure, Adriana.
–
David Powers, Adobe Community Expert
Author, “The Essential Guide to Dreamweaver CS3″ (friends of
ED)
Author, “PHP Solutions” (friends of ED)
http://foundationphp.com/
|||
Your #mainContent div has a 60% width, a 20px padding on both
sides, and a 1px border on the left. All these values add up, so
it’s total width is 60%+40px+1px at the moment.
When its width was set to 76%, its total width was
76%+40px+1px.
The sidebar1 div has a 24% width, so the grand total was
24%+76%+40px+1px. This was 41pixels wider than 100%.
Your #mainContent div was pushed down in Firefox simply
because there was not enough room for it.|||
Oooops, I doubleanswered it… my bad.
Here was only the question when I started to type my post,
but I was slow a little bit.
Is 3:00 AM a valid excuse?|||
> Oooops, I doubleanswered it… my bad.
> Here was only the question when I started to type my
post, but I was slow a
> little bit.
> Is 3:00 AM a valid excuse?
No excuse needed. I appreciate both answers and explanations.
It is I who
should apologise for what was indeed a question I should have
figured out
myself.
–
Regards,
Adriana.
[ put out the rubbish if you need to reach me by e-mail ]
www.spinsister.nl