Join James Williamson for an in-depth discussion in this video Controlling element flexibility, part of CSS Flexbox First Look.
Perhaps the most confusing of flex box is really understanding how to control the…flexbility of flex items within their containers, so in this exercise we're…going to explore the options you have for defining flexibility and what each of…those options mean. So I have flexiblility.htm I'll put out…from 02_02. And just to give you an idea of things…that change just a little bit down here in the structure.…We still have our section with class of flex container.…This time we have four boxes inside of it, but notice that those four boxes have…classes applied to them. Three of them have a class of flex one.…
The third one has a class of flex two, and when we talk about sizing these…differently that's going to come into play and be very, very important.…So I'm just going to write a couple of selectors.…Again, I'm going to paste these in really quickly so you don't have to watch me type…them, and then just go ahead and pause your video and type in these same values.…While you're doing that I'm going to go ahead and explain what these values are.…
- Reviewing Flexbox support
- Defining elements
- Controlling element flow
- Wrapping content
- Defining display ratios
- Aligning single and multiple items
- Nesting flex containers
Skill Level Beginner
1. Flexbox Basics
2. Element Flexibility
Defining display ratios3m 14s
3. Controlling Alignment
4. Element Display Order
Additional resources3m 59s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.