Results 1 to 2 of 2
Feb 8, 2008, 13:43 #1
- Join Date
- Feb 2005
- 0 Post(s)
- 0 Thread(s)
Two right floated elements, one with a clear-right, are changing a left float, why?
Here's the situation: I have to two right floated elements and one left floated element inside a container. Each right floated element is a set width, the second right floated element has a clear: right; applied so it goes underneath the other right floated element.
Then, I have a left floated element inside a standard paragraph. This left floated element is being cleared below the first right float, even though the only clearing rule is clear: right;
In essence, I have no idea why my left float is being effected at all when I was under the impression that the right floats should work on their own.
I know how to fix this problem, so that's not really my question. I just really want to know why this is happening, and how in the world it could be what's expected to happen under the CSS spec.
Insight would be great. I feel like I have a darn good knowledge of CSS so this whole situation is a bit perturbing to me. Thanks for your time everyone!
Here is the example of what I am talking about: http://imulus.net/css_examples/float-issue.html
Feb 8, 2008, 15:42 #2
- Join Date
- Jan 2003
- Hampshire UK
- 180 Post(s)
- 6 Thread(s)
It would be rule 5 in the float model that dictates this behavior.
Originally Posted by w3c
If you have multiple floats that follow each other then you should simply use one floated wrapper for them.
(BTW IE doesn't agree with the specs and is displaying how you expected. Note than when you add a width to the body you will need to add position:relative or IE goes berserk ).