nunomaduro/termwind

Flex with padding

jkniest opened this issue · 1 comments

Heyho,

when using flex to render columns besided each other and then applying padding to each of the boxes causes a weird result.

Working, without padding

        render(<<<HTML
            <div class="flex mt-1 justify-evenly">
                <span class="flex-1 bg-green-100">
                    Today:
                </span>
                <span class="flex-1 bg-green-200">
                    Tomorrow:
                </span>
            </div>
        HTML);

CleanShot 2022-11-20 at 02 41 23


But when applying padding to the boxes they are not properly aligned anymore:

        render(<<<HTML
            <div class="flex mt-1 justify-evenly">
                <span class="flex-1 bg-green-100 p-1">
                    Today:
                </span>
                <span class="flex-1 bg-green-200 p-1">
                    Tomorrow:
                </span>
            </div>
        HTML);

CleanShot 2022-11-20 at 02 41 34

Did I something wrong? I will try to look into the library to figure it out, but maybe I'm just using it wrong 😅 Thanks for the awesome library!

Hey @jkniest I think if you go with just px-1 it should work, multi line flex is not yet supported :(