This shows you the differences between two versions of the page.
Next revision | Previous revisionLast revisionBoth sides next revision | ||
spec:css3-flexbox:use-cases [2011/07/12 14:01] – created alexmog | spec:css3-flexbox:use-cases [2011/07/18 13:17] – [1. toolbar, where items (images + labels) are evenly spaced] alexmog | ||
---|---|---|---|
Line 5: | Line 5: | ||
==== 1. toolbar, where items (images + labels) are evenly spaced ==== | ==== 1. toolbar, where items (images + labels) are evenly spaced ==== | ||
+ | < | ||
+ | === current draft === | ||
+ | |||
+ | < | ||
+ | |||
+ | === 2009 spec === | ||
+ | //requires a spacer element// | ||
+ | |||
+ | < | ||
< | < | ||
Line 28: | Line 37: | ||
</ | </ | ||
+ | < | ||
+ | |||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | </ | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | < | ||
+ | </ | ||
+ | ... | ||
+ | </ | ||
+ | < | ||
+ | toolbar { | ||
+ | display: box; | ||
+ | box-orient: | ||
+ | padding: 3px; | ||
+ | } | ||
+ | spacer { | ||
+ | box-flex: 1; | ||
+ | } | ||
+ | </ | ||
+ | |||
+ | < | ||
==== 2. toolbar, where items are split into groups, and groups are evenly spaced ==== | ==== 2. toolbar, where items are split into groups, and groups are evenly spaced ==== |