diff --git a/src/components/notion/Callout.astro b/src/components/notion/Callout.astro
index 76c0fea..cd92313 100644
--- a/src/components/notion/Callout.astro
+++ b/src/components/notion/Callout.astro
@@ -47,6 +47,8 @@ const callout = block.Callout
 <style>
   .callout {
     display: flex;
+    align-items: flex-start;
+    box-sizing: border-box;
     margin: 0.4rem auto;
     padding: 16px 12px;
     width: 100%;
@@ -60,6 +62,8 @@ const callout = block.Callout
     background: rgba(235, 236, 237, 0.6);
   }
   .callout > div {
+    min-width: 0;
+    flex: 1 1 auto;
     margin: 0;
     line-height: 1.5rem;
   }
diff --git a/src/components/notion/Code.astro b/src/components/notion/Code.astro
index b358521..eaec94e 100644
--- a/src/components/notion/Code.astro
+++ b/src/components/notion/Code.astro
@@ -88,7 +88,14 @@ const displayLanguage =
 
 <style>
   .code {
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: column;
+    align-self: stretch;
     width: 100%;
+    max-width: 100%;
+    min-width: 0;
+    margin-inline: 0;
     margin-bottom: 0.8rem;
     border-radius: 12px;
     overflow: hidden;
@@ -103,6 +110,8 @@ const displayLanguage =
   }
 
   .chrome {
+    width: 100%;
+    min-width: 0;
     display: grid;
     grid-template-columns: auto 1fr auto;
     align-items: center;
@@ -172,17 +181,23 @@ const displayLanguage =
 
   .code .body {
     background: color-mix(in oklab, var(--muted) 12%, transparent);
+    min-width: 0;
+    width: 100%;
   }
 
   .code pre {
+    box-sizing: border-box;
     overflow: auto;
     max-height: 65vh;
     padding: 1rem 1.1rem 1.3rem;
     font-size: 0.9rem;
     line-height: 1.4;
     white-space: pre;
-    min-width: 100%;
+    width: 100%;
+    max-width: 100%;
+    min-width: 0;
     background: transparent;
+    -webkit-overflow-scrolling: touch;
   }
 
   .code pre.mermaid {
diff --git a/src/components/notion/ColumnList.astro b/src/components/notion/ColumnList.astro
index 1284651..181dc4d 100644
--- a/src/components/notion/ColumnList.astro
+++ b/src/components/notion/ColumnList.astro
@@ -28,11 +28,13 @@ if (!block.ColumnList) {
   .column-list {
     display: flex;
     width: 100%;
+    box-sizing: border-box;
     margin: 1rem auto;
     gap: 0 1rem;
-  }
+    }
   .column-list > div {
     flex: 1 1 180px;
+    min-width: 0;
     width: 180px;
   }
   @media (max-width: 640px) {
@@ -40,6 +42,7 @@ if (!block.ColumnList) {
       display: block;
     }
     .column-list > div {
+      min-width: 0;
       width: 100%;
     }
   }