diff --git a/docs/blog.html b/docs/blog.html
index 7cdb1959..0227c8f4 100644
--- a/docs/blog.html
+++ b/docs/blog.html
@@ -10,7 +10,7 @@ route: blog
     <div class="container">
       <div class="columns">
         <div class="column is-4">
-          <p class="subtitle4">
+          <p class="subtitle">
             {{ post.date | date_to_string }}
           </p>
           <h2 class="title">
diff --git a/docs/css/bulma-docs.css b/docs/css/bulma-docs.css
index 6cf1cdf6..90578972 100644
--- a/docs/css/bulma-docs.css
+++ b/docs/css/bulma-docs.css
@@ -2385,6 +2385,15 @@ a.box:active {
   margin-bottom: 1.5rem;
 }
 
+.notification code,
+.notification pre {
+  background: white;
+}
+
+.notification pre code {
+  background: transparent;
+}
+
 .notification .delete {
   position: absolute;
   right: 0.5em;
@@ -3628,6 +3637,15 @@ a.box:active {
   color: inherit;
 }
 
+.message-body code,
+.message-body pre {
+  background: white;
+}
+
+.message-body pre code {
+  background: transparent;
+}
+
 .modal-background {
   bottom: 0;
   left: 0;
@@ -4496,7 +4514,7 @@ label.panel-block:hover {
   flex-basis: 0;
   flex-grow: 1;
   flex-shrink: 1;
-  padding: 10px;
+  padding: 0.75rem;
 }
 
 .columns.is-mobile > .column.is-narrow {
@@ -5178,17 +5196,17 @@ label.panel-block:hover {
 }
 
 .columns {
-  margin-left: -10px;
-  margin-right: -10px;
-  margin-top: -10px;
+  margin-left: -0.75rem;
+  margin-right: -0.75rem;
+  margin-top: -0.75rem;
 }
 
 .columns:last-child {
-  margin-bottom: -10px;
+  margin-bottom: -0.75rem;
 }
 
 .columns:not(:last-child) {
-  margin-bottom: 10px;
+  margin-bottom: 0.75rem;
 }
 
 .columns.is-centered {
@@ -5206,7 +5224,7 @@ label.panel-block:hover {
 }
 
 .columns.is-gapless:not(:last-child) {
-  margin-bottom: 20px;
+  margin-bottom: 1.5rem;
 }
 
 .columns.is-gapless > .column {
@@ -5220,7 +5238,7 @@ label.panel-block:hover {
   }
   .columns.is-grid > .column {
     max-width: 33.3333%;
-    padding: 10px;
+    padding: 0.75rem;
     width: 33.3333%;
   }
   .columns.is-grid > .column + .column {
@@ -5262,17 +5280,17 @@ label.panel-block:hover {
 }
 
 .tile.is-ancestor {
-  margin-left: -10px;
-  margin-right: -10px;
-  margin-top: -10px;
+  margin-left: -0.75rem;
+  margin-right: -0.75rem;
+  margin-top: -0.75rem;
 }
 
 .tile.is-ancestor:last-child {
-  margin-bottom: -10px;
+  margin-bottom: -0.75rem;
 }
 
 .tile.is-ancestor:not(:last-child) {
-  margin-bottom: 10px;
+  margin-bottom: 0.75rem;
 }
 
 .tile.is-child {
@@ -5280,7 +5298,7 @@ label.panel-block:hover {
 }
 
 .tile.is-parent {
-  padding: 10px;
+  padding: 0.75rem;
 }
 
 .tile.is-vertical {
@@ -5288,7 +5306,7 @@ label.panel-block:hover {
 }
 
 .tile.is-vertical > .tile.is-child:not(:last-child) {
-  margin-bottom: 20px !important;
+  margin-bottom: 1.5rem !important;
 }
 
 @media screen and (min-width: 769px) {
diff --git a/sass/components/message.sass b/sass/components/message.sass
index 8158ce82..d5329eab 100644
--- a/sass/components/message.sass
+++ b/sass/components/message.sass
@@ -47,3 +47,8 @@
   padding: 1em 1.25em
   strong
     color: inherit
+  code,
+  pre
+    background: $white
+  pre code
+    background: transparent
diff --git a/sass/elements/notification.sass b/sass/elements/notification.sass
index a0f06f95..5bdc7c37 100644
--- a/sass/elements/notification.sass
+++ b/sass/elements/notification.sass
@@ -4,6 +4,11 @@
   border-radius: $radius
   padding: 1.25rem 2.5rem 1.25rem 1.5rem
   position: relative
+  code,
+  pre
+    background: $white
+  pre code
+    background: transparent
   .delete
     position: absolute
     right: 0.5em
diff --git a/sass/grid/columns.sass b/sass/grid/columns.sass
index e0b8c4a1..e20586a8 100644
--- a/sass/grid/columns.sass
+++ b/sass/grid/columns.sass
@@ -3,7 +3,7 @@
   flex-basis: 0
   flex-grow: 1
   flex-shrink: 1
-  padding: 10px
+  padding: 0.75rem
   .columns.is-mobile > &.is-narrow
     flex: none
   .columns.is-mobile > &.is-full
@@ -204,13 +204,13 @@
         margin-left: ($i / 12) * 100%
 
 .columns
-  margin-left: -10px
-  margin-right: -10px
-  margin-top: -10px
+  margin-left: -0.75rem
+  margin-right: -0.75rem
+  margin-top: -0.75rem
   &:last-child
-    margin-bottom: -10px
+    margin-bottom: -0.75rem
   &:not(:last-child)
-    margin-bottom: 10px
+    margin-bottom: 0.75rem
   // Modifiers
   &.is-centered
     justify-content: center
@@ -221,7 +221,7 @@
     &:last-child
       margin-bottom: 0
     &:not(:last-child)
-      margin-bottom: 20px
+      margin-bottom: 1.5rem
     & > .column
       margin: 0
       padding: 0
@@ -231,7 +231,7 @@
       flex-wrap: wrap
       & > .column
         max-width: 33.3333%
-        padding: 10px
+        padding: 0.75rem
         width: 33.3333%
         & + .column
           margin-left: 0
diff --git a/sass/grid/tiles.sass b/sass/grid/tiles.sass
index 1b1e85d0..e82c7220 100644
--- a/sass/grid/tiles.sass
+++ b/sass/grid/tiles.sass
@@ -7,21 +7,21 @@
   min-height: min-content
   // Modifiers
   &.is-ancestor
-    margin-left: -10px
-    margin-right: -10px
-    margin-top: -10px
+    margin-left: -0.75rem
+    margin-right: -0.75rem
+    margin-top: -0.75rem
     &:last-child
-      margin-bottom: -10px
+      margin-bottom: -0.75rem
     &:not(:last-child)
-      margin-bottom: 10px
+      margin-bottom: 0.75rem
   &.is-child
     margin: 0 !important
   &.is-parent
-    padding: 10px
+    padding: 0.75rem
   &.is-vertical
     flex-direction: column
     & > .tile.is-child:not(:last-child)
-      margin-bottom: 20px !important
+      margin-bottom: 1.5rem !important
   // Responsiveness
   +tablet
     &:not(.is-child)