Hi Jens,
I believe float rule 5) from
http://www.w3.org/TR/1998/REC-CSS2-19980512/visuren.html#float-position
may be the reason div two aligns next to div one. A way around this
(besides the easy reordering of the divs) is to use position:absolute to
float div two right:
div
On Fri, Apr 18, 2008 at 4:02 AM, Jens-Uwe Korff
[EMAIL PROTECTED] wrote:
This is how FF aligns them:
+---+
|heading|
+---+
+---+ ++
| div1 | |div2|
| | ||
+---+ ++
I believe that is correct, according to the spec. A floated element should
move up as
Hi guys,
thanks for all your valuable input. In the end I introduced and floated
to the left another div which wrapped the heading and div1.
This way I ensured that the context was preserved (relationship between
heading and div1's content) and that this new block of content aligned
with div2
Hi group,
I have a really easy setting:
h2 style=float:left;width:300pxheading/h2
div style=float:left;width:300pxdiv one/div
div style=float:right;width:200pxdiv two/div
When I imagine this I expect the browser to render the two left-floated
elements on the left side and the single
Changing the order of the DIVs in the source should fix the problem,
it's strange that you say IE6/7 are rendering as per your ascii layout -
as I tried your code and IE7 rendered the same as Firefox.
h2 style=float:left;width:300pxheading/h2
div style=float:right;width:200pxdiv two/div
div
In your example they should all align with each other (given no width
constraints) and that's exactly what happens in FF for me.
If you want div 1 to be below the others you will need to do something
like this:
h2 style=float:left;width:300pxheading/h2
div style=float:left;width:200pxdiv two/div
Maybe I should clarify:
This is how FF aligns them:
+---+
|heading|
+---+
+---+ ++
| div1 | |div2|
| | ||
+---+ ++
...which is *not* what I want. I'd like to have the IE version, sketched
below.
I think it's because the heading and div1 make up a chain of
Hi Casey,
Changing the order of the DIVs in the source should fix the problem
you're absolutely right - changing the source order would solve the
problem. But in order to keep together what content-wise has to be kept
together (heading and div1) I wanted to know if there is another
solution.
Hi Jens,
In that case, the only solution I can think of is to position: relative
the right floated div, and move it up by the height of the header (with
top: -Xpx;). This of course requires you to have a fixed height for the
header.
Regards,
Casey.
Jens-Uwe Korff wrote:
Hi Casey,
-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
Behalf Of Jens-Uwe Korff
Sent: Thursday, April 17, 2008 7:31 PM
To: wsg@webstandardsgroup.org
Subject: [WSG] Floating model: FF counterintuitive
Hi group,
I have a really easy setting:
h2 style
10 matches
Mail list logo