mobile view body wider than viewport

[DrDBanner]

Makes pages more or less unusable on mobile.

Kaputt

https://github.com/user-attachments/assets/62be9818-9b28-4dea-ae88-08267faec83b

Fixed

https://github.com/user-attachments/assets/7ac20317-a3d3-404d-b6bf-31d721826dab

## Containers correction

<div class="max-w-screen-xl grid grid-cols-12 py-2 px-2">
    <div class="hidden md:block lg:col-span-2 space-y-6">
        <div class="hidden lg:block fixed mt-2 h-full overflow-y-auto pb-32 pl-4">
            <!-- Sidebar content -->
        </div>
    </div> <!-- End of sidebar -->

    <div id="page-content" class="col-span-12 md:col-span-8 lg:col-span-6 prose mx-auto">
        <div class="block lg:hidden flex flex-col mb-4 lg:mb-0">
            <button onclick="document.getElementById('mobile-menu-overlay').classList.remove('hidden');">← Documentation</button>
        </div>
        <!-- Main content -->
    </div> <!-- End of main content -->

    <div class="hidden md:block md:col-span-2 lg:col-span-4 p-4">
        <!-- Additional block content -->
    </div>
</div>

### Crucial CSS
.prose {
  width: 100%;
  max-width: 100vw; /* Ensure it doesn't exceed viewport width */
  margin: 0 auto;
  padding: 0 1rem;
  box-sizing: border-box;
}

@media (min-width: 768px) {
  .prose {
    padding: 0;
  }
}

[turbo124]

Thank you !

I was only able to add in the .css as the div changes gave too much space to the right side column,