Chapter 6. Source Order and Display Order

The Holy Grail layout in Chapter 5 illustrated something important about our new layout methods: they enable the visual display of page elements in an order other than that described in the source. This was previously only possible by taking an item out of flow with absolute positioning—something that turned out not to be all that useful for layout. This ability to disconnect visual display and source order can be used for good and bad alike; we’ll look at the benefits (and risks) in this chapter.

Direction of Flow in Flexbox

The default behavior of flex items is to lay themselves out in document order—the order in which they appear in the ...

Get The New CSS Layout now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.