aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorBryan Brattlof <hello@bryanbrattlof.com>2021-02-13 15:30:00 -0500
committerBryan Brattlof <hello@bryanbrattlof.com>2021-02-13 15:32:38 -0500
commit79b673f28b56a220fde465e94c2b96cf5064be48 (patch)
treee21870b1a300bfdeb163280c7e761caccc778f48
parent98675b3e444132170cde049fb6b3e5ff720bde52 (diff)
downloadbryanbrattlof.com-79b673f28b56a220fde465e94c2b96cf5064be48.tar.gz
bryanbrattlof.com-79b673f28b56a220fde465e94c2b96cf5064be48.tar.bz2
apply clearfix hack to article sections
to eliminate images that have been pulled to the left or right from causing the next section to re-flow, we apply the "clearfix-hack" we applied to <main> in dc5f9fc to .section elements as well
-rw-r--r--stylesheets/article.scss16
1 files changed, 10 insertions, 6 deletions
diff --git a/stylesheets/article.scss b/stylesheets/article.scss
index 21ad89a..825d8c5 100644
--- a/stylesheets/article.scss
+++ b/stylesheets/article.scss
@@ -2,6 +2,14 @@
@import 'footer';
@import 'code';
+%clearfix-hack {
+ &:after {
+ content: "";
+ clear: both;
+ display: table;
+ }
+}
+
/* article title */
header {
@@ -34,6 +42,7 @@ header {
/* page container */
main {
+ @extend %clearfix-hack;
/* Render the `main` element consistently in IE. */
display: block;
@@ -52,12 +61,6 @@ main {
padding: 0;
background: none;
}
-
- &:after {
- content: "";
- clear: both;
- display: table;
- }
}
/* images */
@@ -156,6 +159,7 @@ blockquote {
/* section divs */
.section {
+ @extend %clearfix-hack;
margin: (3 * $default-spacing) 0 0;
}