diff --git a/src/components/Article/Content/MarkdocRenderer/MarkdocRenderer.module.css b/src/components/Article/Content/MarkdocRenderer/MarkdocRenderer.module.css
index e73b46e..2ceff99 100644
--- a/src/components/Article/Content/MarkdocRenderer/MarkdocRenderer.module.css
+++ b/src/components/Article/Content/MarkdocRenderer/MarkdocRenderer.module.css
@@ -7,22 +7,24 @@
 }
 
 .hasMargin {
-  @media screen and (--bp-margin) {
-    @mixin px 0;
+  @supports (anchor-name: --test) {
+    @media screen and (--bp-margin) {
+      @mixin px 0;
 
-    position: relative;
+      position: relative;
 
-    display: flex;
-    gap: var(--spacing-generous);
+      display: flex;
+      gap: var(--spacing-generous);
 
-    max-width: none;
+      max-width: none;
 
-    font-size: clamp(1rem, 2.5vw, 1.25rem);
+      font-size: clamp(1rem, 2.5vw, 1.25rem);
 
-    & .content {
-      flex: 1 1 auto;
-      min-width: 40ch;
-      max-width: 75ch;
+      & .content {
+        flex: 1 1 auto;
+        min-width: 40ch;
+        max-width: 75ch;
+      }
     }
   }
 }
\ No newline at end of file
diff --git a/src/components/Content/Sidenote/Container/Container.module.css b/src/components/Content/Sidenote/Container/Container.module.css
index 1bc8880..92ddaae 100644
--- a/src/components/Content/Sidenote/Container/Container.module.css
+++ b/src/components/Content/Sidenote/Container/Container.module.css
@@ -4,9 +4,11 @@
 }
 
 .wrapper {
-  @media screen and (--bp-margin) {
-    position: absolute;
-    top: anchor(top);
+  @supports (anchor-name: --test) {
+    @media screen and (--bp-margin) {
+      position: absolute;
+      top: anchor(top);
+    }
   }
 }
 
@@ -17,15 +19,17 @@
   position: relative;
   padding-left: var(--size-12);
   font-family: var(--font-mono);
-  
-  @media screen and (--bp-margin) {
-    min-width: var(--size-64);
-    margin-top: 0;
-    padding: var(--spacing-cozy) var(--spacing-cozy) var(--spacing-cozy) var(--size-12) ;
-    border: var(--size-1) solid var(--color-surface-inverse);
 
-    background: var(--color-surface-elevated-1);
-    box-shadow: 2px 2px 0 var(--color-palette-woodsmoke), 4px 4px 0 var(--color-palette-charcoal-gray);
+  @supports (anchor-name: --test) {
+    @media screen and (--bp-margin) {
+      min-width: var(--size-64);
+      margin-top: 0;
+      padding: var(--spacing-cozy) var(--spacing-cozy) var(--spacing-cozy) var(--size-12) ;
+      border: var(--size-1) solid var(--color-surface-inverse);
+
+      background: var(--color-surface-elevated-1);
+      box-shadow: 2px 2px 0 var(--color-palette-woodsmoke), 4px 4px 0 var(--color-palette-charcoal-gray);
+    }
   }
 }