Difficulties to style li/ul using tailwind and kirbytext

I’m actually facing a problem to style my list correctly using tailwind with kirby and kirbytext.

I’m my php i running this call to kirbytext(), wrapped into the correct class for list with tailwind :

      <div class="text-base list-disc list-outside">
        <?= $site->baseline()->kirbytext() ?>

My text is markdown in .txt :




Objectives : 

- xxx
- xxx
- xxx
- xxx

Actually the li and ul are not styled at all :frowning:

welcome to the forum.

tailwind classes need to be applied directly to the ul element not the wrapping div.

you can either create a helper css class

.typography {
   ul {
      @apply list-disc list-outside;
<div class="text-base typography">
        <?= $site->baseline()->kirbytext() ?>

or try to use and configure the tailwind plugin: @tailwindcss/typography - Tailwind CSS
but that is a bit advanced.

1 Like

Also see my blog article on that how to fix this situation. But bnomei’s mention of the typography plugin is worth a consideration. But note that it’s opinionated, too.