Den flex-flow
egenskapen er en under egenskap av Flexible Box Layout modul.
Det er en stenografi for flex-direction
og flex-wrap
.
Syntaks
flex-flow: || .flex-container ( flex-flow: row wrap; )
Du kan angi en eller to verdier, uansett rekkefølge.
Demo
Begge listene oppfører seg på nøyaktig samme måte:
- Den blå har
flex-direction: row
ogflex-wrap: wrap
- Den røde har
flex-flow: row wrap
Sjekk ut denne pennen!
Nettleserstøtte
- (moderne) betyr den nylige syntaksen fra spesifikasjonen (f.eks.
display: flex;
) - (hybrid) betyr en merkelig uoffisiell syntaks fra 2011 (f.eks.
display: flexbox;
) - (gammel) betyr den gamle syntaksen fra 2009 (f.eks.
display: box;
)
Chrome | Safari | Firefox | Opera | DVS | Android | iOS |
---|---|---|---|---|---|---|
21+ (moderne) 20- (gammel) | 3.1+ (gammel) | 2-21 (gammel) 22+ (ny) | 12.1+ (moderne) | 10+ (hybrid) | 2.1+ (gammel) | 3.2+ (gammel) |
Blackberry browser 10+ støtter den nye syntaksen.
For mer informasjon om hvordan du blander syntakser for å få best nettleserstøtte, se denne artikkelen (CSS-Tricks) eller denne artikkelen (DevOpera).