Skip to content

Commit

Permalink
Twenty Twenty-One: Fixes float clearing elements being visible in Row…
Browse files Browse the repository at this point in the history
… and Grid blocks.

The grid layout looks different between front and back end due to the float clearing elements being visible in Row and Grid blocks. This moves the hack rather than deletes it.

Props up1512001, sabernhardt, poena.
Fixes #61611.


git-svn-id: https://develop.svn.wordpress.org/trunk@58853 602fd350-edb4-49c9-b593-d223f7449a82
  • Loading branch information
karmatosed committed Aug 5, 2024
1 parent ddd53c2 commit b17b5d1
Show file tree
Hide file tree
Showing 7 changed files with 35 additions and 37 deletions.
16 changes: 7 additions & 9 deletions src/wp-content/themes/twentytwentyone/assets/css/ie.css
Original file line number Diff line number Diff line change
Expand Up @@ -2239,18 +2239,9 @@ input[type=reset]:disabled,
}

.wp-block-group {
display: block;
clear: both;
display: flow-root;
}

.wp-block-group:before,
.wp-block-group:after {
content: "";
display: block;
clear: both;
}

.wp-block-group .wp-block-group__inner-container {
margin-left: auto;
margin-right: auto;
Expand Down Expand Up @@ -6308,3 +6299,10 @@ footer {
.is-IE .post-thumbnail .wp-post-image {
min-width: auto;
}

.is-IE .wp-block-group:before,
.is-IE .wp-block-group:after {
content: "";
display: block;
clear: both;
}

Large diffs are not rendered by default.

Original file line number Diff line number Diff line change
@@ -1,18 +1,11 @@
.wp-block-group {

// Start IE clearfix.
// This hack is only necessary because we want to support IE11.
// If we don't want to support IE11, then "display: flow-root" would suffice.
display: block;
clear: both;

display: flow-root; // stylelint-disable-line declaration-block-no-duplicate-properties

&:before,
&:after {
content: "";
display: block;
clear: both;
}
// End IE clearfix.

.wp-block-group__inner-container {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -50,4 +50,15 @@
.post-thumbnail .wp-post-image {
min-width: auto;
}

.wp-block-group {

&:before,
&:after {
content: "";
display: block;
clear: both;
}
}

}
16 changes: 7 additions & 9 deletions src/wp-content/themes/twentytwentyone/style-rtl.css
Original file line number Diff line number Diff line change
Expand Up @@ -2131,18 +2131,9 @@ input[type=reset]:disabled,
}

.wp-block-group {
display: block;
clear: both;
display: flow-root;
}

.wp-block-group:before,
.wp-block-group:after {
content: "";
display: block;
clear: both;
}

.wp-block-group .wp-block-group__inner-container {
margin-right: auto;
margin-left: auto;
Expand Down Expand Up @@ -5882,3 +5873,10 @@ footer {
.is-IE .post-thumbnail .wp-post-image {
min-width: auto;
}

.is-IE .wp-block-group:before,
.is-IE .wp-block-group:after {
content: "";
display: block;
clear: both;
}
16 changes: 7 additions & 9 deletions src/wp-content/themes/twentytwentyone/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -2141,18 +2141,9 @@ input[type=reset]:disabled,
}

.wp-block-group {
display: block;
clear: both;
display: flow-root;
}

.wp-block-group:before,
.wp-block-group:after {
content: "";
display: block;
clear: both;
}

.wp-block-group .wp-block-group__inner-container {
margin-left: auto;
margin-right: auto;
Expand Down Expand Up @@ -5918,3 +5909,10 @@ footer {
.is-IE .post-thumbnail .wp-post-image {
min-width: auto;
}

.is-IE .wp-block-group:before,
.is-IE .wp-block-group:after {
content: "";
display: block;
clear: both;
}
2 changes: 1 addition & 1 deletion src/wp-content/themes/twentytwentyone/style.css.map

Large diffs are not rendered by default.

0 comments on commit b17b5d1

Please sign in to comment.