Merge pull request #405 from dpogue/patch-1

Enable IE 10 support for flexible box with the -ms prefix.
This commit is contained in:
Chris Eppstein 2011-06-10 15:43:41 -07:00
commit 00195296b8
2 changed files with 28 additions and 9 deletions

View File

@ -3,7 +3,7 @@
// display:box; must be used for any of the other flexbox mixins to work properly // display:box; must be used for any of the other flexbox mixins to work properly
@mixin display-box { @mixin display-box {
@include experimental-value(display, box, @include experimental-value(display, box,
-moz, -webkit, not -o, not -ms, not -khtml, official -moz, -webkit, not -o, -ms, not -khtml, official
); );
} }
@ -16,7 +16,7 @@ $default-box-orient: horizontal !default;
) { ) {
$orientation : unquote($orientation); $orientation : unquote($orientation);
@include experimental(box-orient, $orientation, @include experimental(box-orient, $orientation,
-moz, -webkit, not -o, not -ms, not -khtml, official -moz, -webkit, not -o, -ms, not -khtml, official
); );
} }
@ -29,7 +29,7 @@ $default-box-align: stretch !default;
) { ) {
$alignment : unquote($alignment); $alignment : unquote($alignment);
@include experimental(box-align, $alignment, @include experimental(box-align, $alignment,
-moz, -webkit, not -o, not -ms, not -khtml, official -moz, -webkit, not -o, -ms, not -khtml, official
); );
} }
@ -43,7 +43,7 @@ $default-box-flex: 0 !default;
$flex: $default-box-flex $flex: $default-box-flex
) { ) {
@include experimental(box-flex, $flex, @include experimental(box-flex, $flex,
-moz, -webkit, not -o, not -ms, not -khtml, official -moz, -webkit, not -o, -ms, not -khtml, official
); );
} }
@ -55,7 +55,7 @@ $default-box-flex-group: 1 !default;
$group: $default-box-flex-group $group: $default-box-flex-group
) { ) {
@include experimental(box-flex-group, $group, @include experimental(box-flex-group, $group,
-moz, -webkit, not -o, not -ms, not -khtml, official -moz, -webkit, not -o, -ms, not -khtml, official
); );
} }
@ -67,7 +67,7 @@ $default-box-ordinal-group: 1 !default;
$group: $default-ordinal-flex-group $group: $default-ordinal-flex-group
) { ) {
@include experimental(box-ordinal-group, $group, @include experimental(box-ordinal-group, $group,
-moz, -webkit, not -o, not -ms, not -khtml, official -moz, -webkit, not -o, -ms, not -khtml, official
); );
} }
@ -80,7 +80,7 @@ $default-box-direction: normal !default;
) { ) {
$direction: unquote($direction); $direction: unquote($direction);
@include experimental(box-direction, $direction, @include experimental(box-direction, $direction,
-moz, -webkit, not -o, not -ms, not -khtml, official -moz, -webkit, not -o, -ms, not -khtml, official
); );
} }
@ -93,7 +93,7 @@ $default-box-lines: single !default;
) { ) {
$lines: unquote($lines); $lines: unquote($lines);
@include experimental(box-lines, $lines, @include experimental(box-lines, $lines,
-moz, -webkit, not -o, not -ms, not -khtml, official -moz, -webkit, not -o, -ms, not -khtml, official
); );
} }
@ -106,6 +106,6 @@ $default-box-pack: start !default;
) { ) {
$pack: unquote($pack); $pack: unquote($pack);
@include experimental(box-pack, $pack, @include experimental(box-pack, $pack,
-moz, -webkit, not -o, not -ms, not -khtml, official -moz, -webkit, not -o, -ms, not -khtml, official
); );
} }

View File

@ -1,84 +1,103 @@
.hbox { .hbox {
display: -moz-box; display: -moz-box;
display: -webkit-box; display: -webkit-box;
display: -ms-box;
display: box; display: box;
-moz-box-orient: horizontal; -moz-box-orient: horizontal;
-webkit-box-orient: horizontal; -webkit-box-orient: horizontal;
-ms-box-orient: horizontal;
box-orient: horizontal; box-orient: horizontal;
-moz-box-align: stretch; -moz-box-align: stretch;
-webkit-box-align: stretch; -webkit-box-align: stretch;
-ms-box-align: stretch;
box-align: stretch; } box-align: stretch; }
.hbox > * { .hbox > * {
-moz-box-flex: 0; -moz-box-flex: 0;
-webkit-box-flex: 0; -webkit-box-flex: 0;
-ms-box-flex: 0;
box-flex: 0; } box-flex: 0; }
.vbox { .vbox {
display: -moz-box; display: -moz-box;
display: -webkit-box; display: -webkit-box;
display: -ms-box;
display: box; display: box;
-moz-box-orient: vertical; -moz-box-orient: vertical;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
-ms-box-orient: vertical;
box-orient: vertical; box-orient: vertical;
-moz-box-align: stretch; -moz-box-align: stretch;
-webkit-box-align: stretch; -webkit-box-align: stretch;
-ms-box-align: stretch;
box-align: stretch; } box-align: stretch; }
.vbox > * { .vbox > * {
-moz-box-flex: 0; -moz-box-flex: 0;
-webkit-box-flex: 0; -webkit-box-flex: 0;
-ms-box-flex: 0;
box-flex: 0; } box-flex: 0; }
.spacer { .spacer {
-moz-box-flex: 1; -moz-box-flex: 1;
-webkit-box-flex: 1; -webkit-box-flex: 1;
-ms-box-flex: 1;
box-flex: 1; } box-flex: 1; }
.reverse { .reverse {
-moz-box-direction: reverse; -moz-box-direction: reverse;
-webkit-box-direction: reverse; -webkit-box-direction: reverse;
-ms-box-direction: reverse;
box-direction: reverse; } box-direction: reverse; }
.box-flex-0 { .box-flex-0 {
-moz-box-flex: 0; -moz-box-flex: 0;
-webkit-box-flex: 0; -webkit-box-flex: 0;
-ms-box-flex: 0;
box-flex: 0; } box-flex: 0; }
.box-flex-1 { .box-flex-1 {
-moz-box-flex: 1; -moz-box-flex: 1;
-webkit-box-flex: 1; -webkit-box-flex: 1;
-ms-box-flex: 1;
box-flex: 1; } box-flex: 1; }
.box-flex-2 { .box-flex-2 {
-moz-box-flex: 2; -moz-box-flex: 2;
-webkit-box-flex: 2; -webkit-box-flex: 2;
-ms-box-flex: 2;
box-flex: 2; } box-flex: 2; }
.box-flex-group-0 { .box-flex-group-0 {
-moz-box-flex-group: 0; -moz-box-flex-group: 0;
-webkit-box-flex-group: 0; -webkit-box-flex-group: 0;
-ms-box-flex-group: 0;
box-flex-group: 0; } box-flex-group: 0; }
.box-flex-group-1 { .box-flex-group-1 {
-moz-box-flex-group: 1; -moz-box-flex-group: 1;
-webkit-box-flex-group: 1; -webkit-box-flex-group: 1;
-ms-box-flex-group: 1;
box-flex-group: 1; } box-flex-group: 1; }
.box-flex-group-2 { .box-flex-group-2 {
-moz-box-flex-group: 2; -moz-box-flex-group: 2;
-webkit-box-flex-group: 2; -webkit-box-flex-group: 2;
-ms-box-flex-group: 2;
box-flex-group: 2; } box-flex-group: 2; }
.start { .start {
-moz-box-pack: start; -moz-box-pack: start;
-webkit-box-pack: start; -webkit-box-pack: start;
-ms-box-pack: start;
box-pack: start; } box-pack: start; }
.end { .end {
-moz-box-pack: end; -moz-box-pack: end;
-webkit-box-pack: end; -webkit-box-pack: end;
-ms-box-pack: end;
box-pack: end; } box-pack: end; }
.center { .center {
-moz-box-pack: center; -moz-box-pack: center;
-webkit-box-pack: center; -webkit-box-pack: center;
-ms-box-pack: center;
box-pack: center; } box-pack: center; }