css positions...is it me or is mozilla nuts?

[ASAAKI]

i give up.:(
i canNOT understand why on earth the css positioning is so totally off in mozilla, here (http://www10.brinkster.com/asaakitesting/auk/viewLesson.html). the "content" div just doesn't come up next to the left bar in the "left" div. i thought it might have been that the width was too wide, or maybe margin-left was too much or maybe i should add the float in the #right>#content rule... nothing is working. every time i refresh the changes, opera does somersaults, but mozilla's just stuck on the same position. and if not that, then it skids far to the right, or ends up causing a horizontal scrollbar for apparently no reason.:confused:
here's the relevant css, minus the unnecessary details:

#left{
float:left;
display:block;
top:100px;
margin-left:5%;
width:19%;
margin:0px;
}
#content{
margin-top:1%;
margin-left:2%;
margin-bottom:2%;
width:95%;
font-size:90%;
background-color:#FFFFFF;
border:1px solid #9BBD34;
color:black;
padding:5px;
}
#right>#content{ /*not for ie*/
width:80%;
margin-left:5%;
}
#right{
float:right;
}

can anyone please help?
this (http://www10.brinkster.com/asaakitesting/auk/viewLesson.html) is the page that's misbehaving beyond belief in mozilla. (okay, beyond belief at least in my narrow domain of knowledge;))
look at the page in IE and then mozilla and u'll know what i'm talking about.

________________
edit
oh goody goody!:D just realized that today's the day i get officially diagnosed with CFaholism :cool::cool:
man i've taken a while.
heh

[ASAAKI]

in my distressful hurry i guess i didn't clarify myself enough, and didn't notice i was posting in the wrong forum either.
so anyway i've edited the above post to make a little more sense.

[pardicity3]

Oh dear, this is a nightmare indeed (how's that for encouragement? :D ). Seriously though, I have had similar instances happen to me. It always seems to happen when I use %'s for margins. Not that this has any direct influence on the problem, but it does make widths harder to control.

First off, what res are you in? Have you tried changing res's to see if the problem is solved. If upping your res does solve the problem then there is most likely a problem with your %-based margins.

Second of all, it seems like maybe you have miscalculated your percentages. If I calculate right you have:

24% on the left (5% margin + 19% width)
85% on the right (80% width + 5% margin)

That of course equals more than 100% which would seem to be a problem, though it is quite possible that I am missing something here and I have just made a fool of myself...back to homework...

[ASAAKI]

well, even when i fix the percents it doesn't work :(. and i do want percents instead of pixels, so it can look right on diff resolutions and browsers, etc.

*cough cough* would, jkd, resident lord of mozilla, please have a say here? :o

[Skyzyx]

I had a problem like this fairly recently too. I just scrapped my CSS file, and completely re-wrote it, and it all worked just peachy. I must've done something woierd and just couldn't find the bug.

[Roy Sinclair]

I see a small thing:

#left{
float:left;
display:block;
top:100px;
margin-left:5%;
width:19%;
margin:0px;
}


The final "margin:0px;" should override the "margin-left:5%;" so the order of the items should be changed or the extra declaration removed.

Adding a width to the #right css will bring the content back into line.

#right
{
float:left;
width: 80%;
}