newbie newbie - 1 year ago 67
CSS Question

HTML float right element order

If I have three elements flaoted to right, why order is following (see jsfiddle) element 1 is first element on right side, when element 3 is actually last element.

Order is now

[3] [2] [1]

But elements are in this order in html

[1] [2] [3]


Answer Source

That 'inverted order' is the intended result.

You can dig around in the CSS Specification if you'd like, but your example renders as it ought to.

If you'd like them to display in the same order as the markup, float the .container right, its children left.

Updated jsfiddle