Fixed multiple display:flex issues in IE11
authorMarcel Werk <burntime@woltlab.com>
Fri, 16 Dec 2016 12:32:20 +0000 (13:32 +0100)
committerMarcel Werk <burntime@woltlab.com>
Fri, 16 Dec 2016 12:32:20 +0000 (13:32 +0100)
wcfsetup/install/files/style/layout/box.scss
wcfsetup/install/files/style/layout/containerList.scss
wcfsetup/install/files/style/layout/grid.scss
wcfsetup/install/files/style/ui/messageEditHistory.scss

index 9adcf3bc22025dff3fac4131a6a975d820ad2bf6..1d6479e29cd004c603737e39bd5175bb9e997ebe 100644 (file)
                
                @include screen-sm-md {
                        flex: 0 0 50%;
+                       max-width: 50%;
                        
                        &.boxFullWidth {
                                flex-basis: 100%;
+                               max-width: none;
                        }
                        
                        /* one item */
                        &:first-child:nth-last-child(1) {
                                flex-basis: 100%;
+                               max-width: none;
                        }
                }
                
                @include screen-lg {
                        flex: 0 0 25%;
                        margin-bottom: 60px;
+                       max-width: 25%;
                        
                        &.boxFullWidth {
                                flex-basis: 100%;
+                               max-width: none;
                        }
                        
                        /* one item */
                        &:first-child:nth-last-child(1) {
                                flex-basis: 100%;
+                               max-width: none;
                        }
                        
                        /* two items */
                        &:first-child:nth-last-child(2),
                        &:first-child:nth-last-child(2) ~ .box {
                                flex-basis: 50%;
+                               max-width: 50%;
                        }
                        
                        /* three items */
                        &:first-child:nth-last-child(3),
                        &:first-child:nth-last-child(3) ~ .box {
                                flex-basis: 33.3333%;
+                               max-width: 33.3333%;
                        }
                }
        }
                @include screen-md-up {
                        flex: 0 0 50%;
                        margin-bottom: 60px;
+                       max-width: 50%;
                        
                        &.boxFullWidth {
                                flex-basis: 100%;
+                               max-width: none;
                        }
                }
        }
                        > li {
                                flex: 0 0 25%;
                                margin-bottom: 20px;
+                               max-width: 25%;
                                
                                > .boxMenuLink {
                                        @include wcfFontHeadline;
index 2411de62e188e340947bb31251d5047d364ca8db..97323e12e4b08fc464ecfb065088a2fc9b858206 100644 (file)
                
                &.doubleColumned > li {
                        flex: 0 0 50%;
+                       max-width: 50%;
                }
                
                &.tripleColumned > li {
index 0bc405bfd6749122e290a2e959199493c93709bf..fa8bd23378aed42029934d95ad7d945458d778e2 100644 (file)
 
 .col-xs-1 {
        flex: 0 0 8.333333%;
+       max-width: 8.333333%;
 }
 
 .col-xs-2 {
        flex: 0 0 16.666667%;
+       max-width: 16.666667%;
 }
 
 .col-xs-3 {
        flex: 0 0 25%;
+       max-width: 25%;
 }
 
 .col-xs-4 {
        flex: 0 0 33.333333%;
+       max-width: 33.333333%;
 }
 
 .col-xs-5 {
        flex: 0 0 41.666667%;
+       max-width: 41.666667%;
 }
 
 .col-xs-6 {
        flex: 0 0 50%;
+       max-width: 50%;
 }
 
 .col-xs-7 {
        flex: 0 0 58.333333%;
+       max-width: 58.333333%;
 }
 
 .col-xs-8 {
        flex: 0 0 66.666667%;
+       max-width: 66.666667%;
 }
 
 .col-xs-9 {
        flex: 0 0 75%;
+       max-width: 75%;
 }
 
 .col-xs-10 {
        flex: 0 0 83.333333%;
+       max-width: 83.333333%;
 }
 
 .col-xs-11 {
        flex: 0 0 91.666667%;
+       max-width: 91.666667%;
 }
 
 .col-xs-12 {
 @include screen-md-up {
        .col-md-1 {
                flex: 0 0 8.333333%;
+               max-width: 8.333333%;
        }
        .col-md-2 {
                flex: 0 0 16.666667%;
+               max-width: 16.666667%;
        }
        .col-md-3 {
                flex: 0 0 25%;
+               max-width: 25%;
        }
        .col-md-4 {
                flex: 0 0 33.333333%;
+               max-width: 33.333333%;
        }
        .col-md-5 {
                flex: 0 0 41.666667%;
+               max-width: 41.666667%;
        }
        .col-md-6 {
                flex: 0 0 50%;
+               max-width: 50%;
        }
        .col-md-7 {
                flex: 0 0 58.333333%;
+               max-width: 58.333333%;
        }
        .col-md-8 {
                flex: 0 0 66.666667%;
+               max-width: 66.666667%;
        }
        .col-md-9 {
                flex: 0 0 75%;
+               max-width: 75%;
        }
        .col-md-10 {
                flex: 0 0 83.333333%;
+               max-width: 83.333333%;
        }
        .col-md-11 {
                flex: 0 0 91.666667%;
+               max-width: 91.666667%;
        }
        .col-md-12 {
                flex: 0 0 100%;
+               max-width: none;
        }
        .col-md-pull-0 {
                right: auto;
index 8bae5c6f4767955ae23cece49fdd9946c585135e..d946d94bd071735342dcd186874f578f29d97a8e 100644 (file)
@@ -10,6 +10,7 @@
                
                > div {
                        flex: 0 0 50%;
+                       max-width: 50%;
                        
                        &:first-child {
                                padding-right: 10px;