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.

Built from https://develop.svn.wordpress.org/branches/4.9@43674


git-svn-id: http://core.svn.wordpress.org/branches/4.9@43503 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Adam Silverstein 2018-10-05 14:51:26 +00:00
parent 1963afa5ff
commit b250096446
5 changed files with 137 additions and 25 deletions

View File

@ -225,19 +225,55 @@
width: 36%;
}
.try-gutenberg-panel .try-gutenberg-panel-column-container {
display: flex;
margin-bottom: 13px;
}
@supports (display: grid) {
.try-gutenberg-panel .try-gutenberg-panel-column-container {
display: -ms-grid;
display: grid;
-ms-grid-columns: 36% 32% 32%;
grid-template-columns: 36% 32% 32%;
margin-bottom: 13px;
}
}
.try-gutenberg-panel .try-gutenberg-panel-image-column {
width: 36%;
}
@supports (display: grid) {
.try-gutenberg-panel .try-gutenberg-panel-image-column {
width: auto;
}
}
.try-gutenberg-panel .try-gutenberg-panel-column:not(.try-gutenberg-panel-image-column) {
display: flex;
flex-direction: column;
justify-content: space-between;
width: 32%;
}
@supports (display: grid) {
.try-gutenberg-panel .try-gutenberg-panel-column:not(.try-gutenberg-panel-image-column) {
display: -ms-grid;
display: grid;
-ms-grid-rows: auto 100px;
grid-template-rows: auto 100px;
width: auto;
}
}
.try-gutenberg-panel .try-gutenberg-action {
height: 100px;
}
@supports (display: grid) {
.try-gutenberg-panel .try-gutenberg-action {
height: auto;
}
}
.welcome-panel-column p.hide-if-no-customize {
@ -1269,6 +1305,16 @@ a.rsswidget {
.try-gutenberg-panel .try-gutenberg-panel-image-column {
display: none;
}
.try-gutenberg-panel .try-gutenberg-panel-column:not(.try-gutenberg-panel-image-column) {
width: 50%;
}
@supports (display: grid) {
.try-gutenberg-panel .try-gutenberg-panel-column:not(.try-gutenberg-panel-image-column) {
width: auto;
}
}
}
@media screen and (max-width: 870px) {
@ -1279,10 +1325,20 @@ a.rsswidget {
width: 100%;
}
.try-gutenberg-panel .try-gutenberg-panel-column-container {
flex-wrap: wrap;
}
@supports (display: grid) {
.try-gutenberg-panel .try-gutenberg-panel-column-container {
-ms-grid-columns: 100%;
grid-template-columns: 100%;
}
}
.try-gutenberg-panel .try-gutenberg-panel-column:not(.try-gutenberg-panel-image-column) {
width: 100%;
}
.welcome-panel .welcome-panel-column li {
display: inline-block;

File diff suppressed because one or more lines are too long

View File

@ -225,19 +225,55 @@
width: 36%;
}
.try-gutenberg-panel .try-gutenberg-panel-column-container {
display: flex;
margin-bottom: 13px;
}
@supports (display: grid) {
.try-gutenberg-panel .try-gutenberg-panel-column-container {
display: -ms-grid;
display: grid;
-ms-grid-columns: 36% 32% 32%;
grid-template-columns: 36% 32% 32%;
margin-bottom: 13px;
}
}
.try-gutenberg-panel .try-gutenberg-panel-image-column {
width: 36%;
}
@supports (display: grid) {
.try-gutenberg-panel .try-gutenberg-panel-image-column {
width: auto;
}
}
.try-gutenberg-panel .try-gutenberg-panel-column:not(.try-gutenberg-panel-image-column) {
display: flex;
flex-direction: column;
justify-content: space-between;
width: 32%;
}
@supports (display: grid) {
.try-gutenberg-panel .try-gutenberg-panel-column:not(.try-gutenberg-panel-image-column) {
display: -ms-grid;
display: grid;
-ms-grid-rows: auto 100px;
grid-template-rows: auto 100px;
width: auto;
}
}
.try-gutenberg-panel .try-gutenberg-action {
height: 100px;
}
@supports (display: grid) {
.try-gutenberg-panel .try-gutenberg-action {
height: auto;
}
}
.welcome-panel-column p.hide-if-no-customize {
@ -1269,6 +1305,16 @@ a.rsswidget {
.try-gutenberg-panel .try-gutenberg-panel-image-column {
display: none;
}
.try-gutenberg-panel .try-gutenberg-panel-column:not(.try-gutenberg-panel-image-column) {
width: 50%;
}
@supports (display: grid) {
.try-gutenberg-panel .try-gutenberg-panel-column:not(.try-gutenberg-panel-image-column) {
width: auto;
}
}
}
@media screen and (max-width: 870px) {
@ -1279,10 +1325,20 @@ a.rsswidget {
width: 100%;
}
.try-gutenberg-panel .try-gutenberg-panel-column-container {
flex-wrap: wrap;
}
@supports (display: grid) {
.try-gutenberg-panel .try-gutenberg-panel-column-container {
-ms-grid-columns: 100%;
grid-template-columns: 100%;
}
}
.try-gutenberg-panel .try-gutenberg-panel-column:not(.try-gutenberg-panel-image-column) {
width: 100%;
}
.welcome-panel .welcome-panel-column li {
display: inline-block;

File diff suppressed because one or more lines are too long

View File

@ -4,7 +4,7 @@
*
* @global string $wp_version
*/
$wp_version = '4.9.9-alpha-43656';
$wp_version = '4.9.9-alpha-43674';
/**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.