diff --git a/sites/sandbox/src/code-sample.tsx b/sites/sandbox/src/code-sample.tsx
index 3390c490..0380c1ce 100644
--- a/sites/sandbox/src/code-sample.tsx
+++ b/sites/sandbox/src/code-sample.tsx
@@ -205,7 +205,7 @@ export const pythonExample = `<pre class="shiki custom-theme" style="background-
 <span class="line"><span style="color:var(--foreground)">    </span><span style="color:var(--foreground);font-weight:bold">print</span><span style="color:var(--foreground)">(</span><span style="color:var(--color-orange-800)">f"Hello Python! On step {i}"</span><span style="color:var(--foreground)">)</span></span>
 <span class="line"><span style="color:var(--foreground)">    </span><span style="color:var(--foreground);font-weight:bold">time</span><span style="color:var(--foreground)">.sleep(1)</span></span></code></pre>`;
 
-export const websocketExample = `<pre class="shiki custom-theme" style="background-color:var(--background);color:var(--foreground)" tabindex="0"><code><span class="line"><span style="color:var(--foreground);font-weight:bold">import</span><span style="color:var(--foreground)"> { getSandbox, connect } </span><span style="color:var(--foreground);font-weight:bold">from</span><span style="color:var(--color-orange-800)"> '@cloudflare/sandbox'</span><span style="color:var(--foreground)">;</span></span>
+export const websocketExample = `<pre class="shiki custom-theme max-w-full overflow-auto" style="background-color:var(--background);color:var(--foreground)" tabindex="0"><code><span class="line"><span style="color:var(--foreground);font-weight:bold">import</span><span style="color:var(--foreground)"> { getSandbox, connect } </span><span style="color:var(--foreground);font-weight:bold">from</span><span style="color:var(--color-orange-800)"> '@cloudflare/sandbox'</span><span style="color:var(--foreground)">;</span></span>
 <span class="line"></span>
 <span class="line"><span style="color:var(--foreground);font-weight:bold">export</span><span style="color:var(--foreground);font-weight:bold"> default</span><span style="color:var(--foreground)"> {</span></span>
 <span class="line"><span style="color:var(--foreground)">  async fetch(request</span><span style="color:var(--foreground);font-weight:bold">:</span><span style="color:var(--foreground)"> Request, env</span><span style="color:var(--foreground);font-weight:bold">:</span><span style="color:var(--foreground)"> Env)</span><span style="color:var(--foreground);font-weight:bold"></span><span style="color:var(--foreground)"> {</span></span>
diff --git a/sites/sandbox/src/components/grid.tsx b/sites/sandbox/src/components/grid.tsx
index 7b9b0b31..33187bc0 100644
--- a/sites/sandbox/src/components/grid.tsx
+++ b/sites/sandbox/src/components/grid.tsx
@@ -131,7 +131,7 @@ export function CodeBlock({ children }: { children: string }) {
       </button>
 
       <div
-        className="h-full w-full border bg-background flex items-center justify-center p-3 sm:p-4 min-w-0 min-h-0"
+        className="h-full w-full border bg-background pl-6 sm:pl-8 pr-3 sm:pr-4 pt-8 sm:pt-12 pb-3 sm:pb-4 overflow-auto"
         // biome-ignore lint/security/noDangerouslySetInnerHtml: children is safe
         dangerouslySetInnerHTML={{ __html: children }}
         style={