Re: [css3-flexbox] miscellaneous comments on Chapter 4. Flex Items

On Jul 26, 2012, at 9:12 AM, "Tab Atkins Jr." <jackalmage@gmail.com> wrote:

> On Wed, Jul 25, 2012 at 11:59 PM, Brad Kemper <brad.kemper@gmail.com> wrote:
>> I find this pretty weird. 'order' can move something around in one
>> dimension, and then absolutely positioning it in the other direction gives
>> it a completely different placement for the dimension that stayed 'auto'?
>> That is completely counterintuitive. Even a 'float:left' in tlr text that
>> becomes abspos (with auto positions) still maintains a pretty similar visual
>> ordering with its apparent siblings. 'order' can change what the apparent
>> siblings are, and I don't think 'position:absolute' should automatically
>> change it back.
> 
> I don't understand - turning a float into an abspos doesn't maintain
> the visual ordering at all.  It maintains the vertical position,
> because both types of positioning use the "static" vertical position,
> but the horizontal position will often be very different.

Sorry, I meant in a typical situation where there is a left float at the beginning of (or right before) a paragraph, the stuff that was before the float will still be before it, and the stuff that was after it will still be after it.

In the old days, I wouldn't float something from the middle of a paragraph, because of more inconsistent results in browser (as I recall). I imagine that's gotten much better since then, but old habits die hard, and my typical also seems to be the most common pattern for simple floats in other sites I've looked at.

>> Doesn't 'margin-left' combine with the 'left' property to affect where a
>> left edge ends up, even if it is 'left:auto'? So should 'order' affect where
>> an absolutely positioned flex box item end up, even if the edge-positioning
>> values are all 'auto'.
> 
> margin combines with t/r/b/l exactly as much as border and padding do,
> because t/r/b/l position the margin box.

I know why it works, from that mechanistic view. The end result is that properties like margin that move things around also tend to move around the abspos element, and it is unintuitive to have 'order' work so differently. 

With float and clear, there is no reasonable or useful way to have them continue to interact the way they did with other elements once the item is positioned, since positioning causes it to stop affecting the space it takes up in the flow. But the same is not true for 'order'. It should maintain its relationship with the other elements, aside from the spacing and sizing and positions of the other elements being as though the item wasn't there.

Received on Thursday, 26 July 2012 17:03:42 UTC