diff --git a/src/components/pretty-schema-display.tsx b/src/components/pretty-schema-display.tsx
index cd13b38..f993d73 100644
--- a/src/components/pretty-schema-display.tsx
+++ b/src/components/pretty-schema-display.tsx
@@ -114,13 +114,13 @@ const SchemaObjectRenderer = ({
         return (
           <div
             key={key}
-            className="grid grid-cols-1 md:grid-cols-[160px_1fr] gap-x-4 gap-y-1"
+            className="grid grid-cols-1 md:grid-cols-[auto_auto] md:justify-start gap-x-6 gap-y-1"
           >
-            <div className="flex items-center gap-2 font-semibold text-sm text-muted-foreground flex-shrink-0">
+            <div className="flex items-center gap-2 font-semibold text-sm text-muted-foreground flex-shrink-0 whitespace-nowrap">
               {Icon && <Icon className="h-4 w-4" />}
               <span>{label}</span>
             </div>
-            <div className="flex-grow text-sm text-foreground md:pl-0">
+            <div className="text-sm text-foreground pl-6 md:pl-0">
               {key === "@type" ? (
                 <Badge variant="secondary">{value as string}</Badge>
               ) : (