Make WordPress Core

Changeset 43674


Ignore:
Timestamp:
10/05/2018 02:50:31 PM (5 years ago)
Author:
adamsilverstein
Message:

Try Gutenberg callout: improve formatting for Internet Explorer 11.

Correct an issue where the layout of the "Try Gutenberg" callout added in #41316 falls apart under IE11.

Props kjellr, ianbelanger, pbiron, Luciano Croce, belcherj, ryansommers.
Fixes #44742.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • branches/4.9/src/wp-admin/css/dashboard.css

    r43536 r43674  
    227227
    228228.try-gutenberg-panel .try-gutenberg-panel-column-container {
    229     display: -ms-grid;
    230     display: grid;
    231     -ms-grid-columns: 36% 32% 32%;
    232     grid-template-columns: 36% 32% 32%;
     229    display: flex;
    233230    margin-bottom: 13px;
    234231}
    235232
     233@supports (display: grid) {
     234    .try-gutenberg-panel .try-gutenberg-panel-column-container {
     235        display: -ms-grid;
     236        display: grid;
     237        -ms-grid-columns: 36% 32% 32%;
     238        grid-template-columns: 36% 32% 32%;
     239    }
     240}
     241
     242.try-gutenberg-panel .try-gutenberg-panel-image-column {
     243    width: 36%;
     244}
     245
     246@supports (display: grid) {
     247    .try-gutenberg-panel .try-gutenberg-panel-image-column {
     248        width: auto;
     249    }
     250}
     251
    236252.try-gutenberg-panel .try-gutenberg-panel-column:not(.try-gutenberg-panel-image-column) {
    237     display: -ms-grid;
    238     display: grid;
    239     -ms-grid-rows: auto 100px;
    240     grid-template-rows: auto 100px;
     253    display: flex;
     254    flex-direction: column;
     255    justify-content: space-between;
     256    width: 32%;
     257}
     258
     259@supports (display: grid) {
     260    .try-gutenberg-panel .try-gutenberg-panel-column:not(.try-gutenberg-panel-image-column) {
     261        display: -ms-grid;
     262        display: grid;
     263        -ms-grid-rows: auto 100px;
     264        grid-template-rows: auto 100px;
     265        width: auto;
     266    }
     267}
     268
     269.try-gutenberg-panel .try-gutenberg-action {
     270    height: 100px;
     271}
     272
     273@supports (display: grid) {
     274    .try-gutenberg-panel .try-gutenberg-action {
     275        height: auto;
     276    }
    241277}
    242278
     
    256292
    257293.welcome-panel .welcome-panel-column ul {
    258         margin: 0.8em 1em 1em 0;
     294    margin: 0.8em 1em 1em 0;
    259295}
    260296
     
    12701306        display: none;
    12711307    }
     1308
     1309    .try-gutenberg-panel .try-gutenberg-panel-column:not(.try-gutenberg-panel-image-column) {
     1310        width: 50%;
     1311    }
     1312
     1313    @supports (display: grid) {
     1314        .try-gutenberg-panel .try-gutenberg-panel-column:not(.try-gutenberg-panel-image-column) {
     1315            width: auto;
     1316        }
     1317    }
    12721318}
    12731319
     
    12811327
    12821328    .try-gutenberg-panel .try-gutenberg-panel-column-container {
    1283         -ms-grid-columns: 100%;
    1284         grid-template-columns: 100%;
     1329        flex-wrap: wrap;
     1330    }
     1331
     1332    @supports (display: grid) {
     1333        .try-gutenberg-panel .try-gutenberg-panel-column-container {
     1334            -ms-grid-columns: 100%;
     1335            grid-template-columns: 100%;
     1336        }
     1337    }
     1338
     1339    .try-gutenberg-panel .try-gutenberg-panel-column:not(.try-gutenberg-panel-image-column) {
     1340        width: 100%;
    12851341    }
    12861342
Note: See TracChangeset for help on using the changeset viewer.