flexbox.less
123 lines
| 2.0 KiB
| text/x-less
|
LessCssLexer
Bussonnier Matthias
|
r9271 | |||
/* Flexible box model classes */ | ||||
/* Taken from Alex Russell http://infrequently.org/2009/08/css-3-progress/ */ | ||||
Matthias BUSSONNIER
|
r9284 | |||
Bussonnier Matthias
|
r9271 | .hbox { | ||
Brian E. Granger
|
r13696 | display: -webkit-box; | ||
-webkit-box-orient: horizontal; | ||||
-webkit-box-align: stretch; | ||||
Matthias BUSSONNIER
|
r9284 | |||
Brian E. Granger
|
r13696 | display: -moz-box; | ||
-moz-box-orient: horizontal; | ||||
-moz-box-align: stretch; | ||||
Matthias BUSSONNIER
|
r9284 | |||
Brian E. Granger
|
r13696 | display: box; | ||
box-orient: horizontal; | ||||
box-align: stretch; | ||||
Bussonnier Matthias
|
r9271 | } | ||
Matthias BUSSONNIER
|
r9284 | |||
Bussonnier Matthias
|
r9271 | .hbox > * { | ||
Brian E. Granger
|
r13696 | -webkit-box-flex: 0; | ||
-moz-box-flex: 0; | ||||
box-flex: 0; | ||||
Bussonnier Matthias
|
r9271 | } | ||
Matthias BUSSONNIER
|
r9284 | |||
Bussonnier Matthias
|
r9271 | .vbox { | ||
Brian E. Granger
|
r13696 | display: -webkit-box; | ||
-webkit-box-orient: vertical; | ||||
-webkit-box-align: stretch; | ||||
display: -moz-box; | ||||
-moz-box-orient: vertical; | ||||
-moz-box-align: stretch; | ||||
display: box; | ||||
box-orient: vertical; | ||||
box-align: stretch; | ||||
/* width must be 100% to force FF to behave like webkit */ | ||||
width: 100%; | ||||
Bussonnier Matthias
|
r9271 | } | ||
Matthias BUSSONNIER
|
r9284 | |||
Bussonnier Matthias
|
r9271 | .vbox > * { | ||
Brian E. Granger
|
r13696 | -webkit-box-flex: 0; | ||
-moz-box-flex: 0; | ||||
box-flex: 0; | ||||
Bussonnier Matthias
|
r9271 | } | ||
Matthias BUSSONNIER
|
r9284 | |||
Bussonnier Matthias
|
r9271 | .reverse { | ||
Brian E. Granger
|
r13696 | -webkit-box-direction: reverse; | ||
-moz-box-direction: reverse; | ||||
box-direction: reverse; | ||||
Bussonnier Matthias
|
r9271 | } | ||
Matthias BUSSONNIER
|
r9284 | |||
Bussonnier Matthias
|
r9271 | .box-flex0 { | ||
Brian E. Granger
|
r13696 | -webkit-box-flex: 0; | ||
-moz-box-flex: 0; | ||||
box-flex: 0; | ||||
Bussonnier Matthias
|
r9271 | } | ||
Matthias BUSSONNIER
|
r9284 | |||
Matthias BUSSONNIER
|
r10218 | .box-flex1 { | ||
Brian E. Granger
|
r13696 | -webkit-box-flex: 1; | ||
-moz-box-flex: 1; | ||||
box-flex: 1; | ||||
Bussonnier Matthias
|
r9271 | } | ||
Matthias BUSSONNIER
|
r9284 | |||
Matthias BUSSONNIER
|
r10218 | .box-flex { | ||
.box-flex1(); | ||||
} | ||||
Bussonnier Matthias
|
r9271 | .box-flex2 { | ||
Brian E. Granger
|
r13696 | -webkit-box-flex: 2; | ||
-moz-box-flex: 2; | ||||
box-flex: 2; | ||||
Bussonnier Matthias
|
r9271 | } | ||
Matthias BUSSONNIER
|
r9284 | |||
Bussonnier Matthias
|
r9271 | .box-group1 { | ||
Brian E. Granger
|
r13696 | -webkit-box-flex-group: 1; | ||
-moz-box-flex-group: 1; | ||||
box-flex-group: 1; | ||||
Bussonnier Matthias
|
r9271 | } | ||
Matthias BUSSONNIER
|
r9284 | |||
Bussonnier Matthias
|
r9271 | .box-group2 { | ||
Brian E. Granger
|
r13696 | -webkit-box-flex-group: 2; | ||
-moz-box-flex-group: 2; | ||||
box-flex-group: 2; | ||||
Bussonnier Matthias
|
r9271 | } | ||
Matthias BUSSONNIER
|
r9284 | |||
Bussonnier Matthias
|
r9271 | .start { | ||
Brian E. Granger
|
r13696 | -webkit-box-pack: start; | ||
-moz-box-pack: start; | ||||
box-pack: start; | ||||
Bussonnier Matthias
|
r9271 | } | ||
Matthias BUSSONNIER
|
r9284 | |||
Bussonnier Matthias
|
r9271 | .end { | ||
Brian E. Granger
|
r13696 | -webkit-box-pack: end; | ||
-moz-box-pack: end; | ||||
box-pack: end; | ||||
Bussonnier Matthias
|
r9271 | } | ||
Matthias BUSSONNIER
|
r9284 | |||
Bussonnier Matthias
|
r9271 | .center { | ||
Brian E. Granger
|
r13696 | -webkit-box-pack: center; | ||
-moz-box-pack: center; | ||||
box-pack: center; | ||||
Bussonnier Matthias
|
r9271 | } | ||
Jonathan Frederic
|
r14333 | |||
/* Code below was added on 11/6/2013 by Jonathan Frederic */ | ||||
Jonathan Frederic
|
r14335 | .align-start { | ||
Jonathan Frederic
|
r14333 | -webkit-box-align: start; | ||
-moz-box-align: start; | ||||
box-align: start; | ||||
} | ||||
Jonathan Frederic
|
r14335 | .align-end { | ||
Jonathan Frederic
|
r14333 | -webkit-box-align: end; | ||
-moz-box-align: end; | ||||
box-align: end; | ||||
} | ||||
Jonathan Frederic
|
r14335 | .align-center { | ||
Jonathan Frederic
|
r14333 | -webkit-box-align: center; | ||
-moz-box-align: center; | ||||
box-align: center; | ||||
} | ||||