Template:Flexbox-item-header: Difference between revisions
Jump to navigation
Jump to search
>Corveroth |
>Corveroth |
||
(8 intermediate revisions by the same user not shown) | |||
Line 9: | Line 9: | ||
Frankly, the code for this is a mess, but it ''is'' necessary until the underlying technology is a more widespread web standard. | Frankly, the code for this is a mess, but it ''is'' necessary until the underlying technology is a more widespread web standard. | ||
== See also == | == See also == | ||
[https://css-tricks.com/snippets/css/a-guide-to-flexbox/ A Guide to CSS Flexbox]</noinclude><div style="-webkit-box-flex: 1; -moz-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; -webkit-box-ordinal-group: {{{order}}}; -moz-box-ordinal-group: {{{order}}}; -ms-flex-order: {{{order}}}; -webkit-order: {{{order}}}; order: {{{order}}}; {{{style|}}};"> | [https://css-tricks.com/snippets/css/a-guide-to-flexbox/ A Guide to CSS Flexbox][[Category:Main page components]]</noinclude><div class="{{#if:{{{mobilehide|}}}|mobilehide| |}}" style="-webkit-box-flex: 0 1 auto; -moz-box-flex: 0 1 auto; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-box-ordinal-group: {{{order}}}; -moz-box-ordinal-group: {{{order}}}; -ms-flex-order: {{{order}}}; -webkit-order: {{{order}}}; order: {{{order}}}; {{{style|}}};"> |
Latest revision as of 05:44, 20 June 2017
Flexbox-item-header opens a wrapper for elements within a flexbox.
It sets several CSS properties that are meaningless outside of an HTML element with display: flex
.
It must be closed with either Template:Flexbox-footer, or a </div>
.
Flexbox-item-header accepts two parameters. order
is required and sets the position of this flexbox-item relative to others; it accepts any integer. style
allows for arbitrary CSS.
Frankly, the code for this is a mess, but it is necessary until the underlying technology is a more widespread web standard.