htmlcsstailwind-cssauto-generate

Tailwind CSS: Styling Dynamically Created HTML

Any one figure out a good way to style auto-generated HTML code with Tailwind CSS?

Example: Using a library like Marked to convert Markdown into HTML, which would then be injected into the page.

The key here, is that you do not know the structure of the auto-generated HTML as the markdown could be in any format created by the author.

Solution 
  • npm install @tailwindcss/typography

    configure tailwind.config.js plugins:

    plugins: [
    require("@tailwindcss/typography")
  ],

    use it in component with a special className

      <article className="prose lg:prose-xl">
        <div dangerouslySetInnerHTML={{ __html: dynamicContentHere }} />
      </article>