From the course: CSS Layouts: From Float to Flexbox and Grid
Unlock the full course today
Join today to access over 22,500 courses taught by industry experts or purchase this course individually.
The order property - CSS Tutorial
From the course: CSS Layouts: From Float to Flexbox and Grid
The order property
- [Instructor] Another new Flexbox property is order, which is used to change the layout order of flex items, without changing the HTML. This is something that was previously unavailable with traditional layout techniques. But note, this will only visually change the order. To make sure the content itself is still accessible, the source order of the content in the HTML should make sense. The order value is defined by a single number. By default, all flex items have an order value of zero and are laid out in the same order as they appear in the HTML. When using order, the flex container will layout its flex items starting from the lowest number. You can also use negative values to make items appear earlier than items set at zero. Again, this is only for making a visual change. Make sure the content in the HTML follows a logical order. In the floats layout exercise we weren't able to align the navigation before the main…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.