skip to content
Alvin Lucillo

Markdown elements to take full width in Astro

/ 1 min read

astro, tailwindcss

💻 Tech

If you use Tailwind CSS with Astro, and you have markdown content passed into the <slot>, you can use the prose class to style the markdown content. However, the elements may not take the full width of the container. To fix this, you can add the max-w-none class to the class:

<div class="prose max-w-none">
  <slot />
</div>