Label : Spacing

[ZaxyxaZ]

Hi Li Hau,

Having an issue where the : ends up at the end of the page and not justified with the attribute (label). Got any ideas that could be causing this...I'm using SvelteKit with DaisyUI and TailwindsCSS.

Looks like you have an extra span in the li that places the label and : at opposite ends of the container causing the formatting issue.

BTW - I have roots in Singapore and Malaysia and I really enjoy watching your videos. You are certainly one smart guy with lots of potential.

[pmalacho-mit]

Hi @ZaxyxaZ -- I'm facing the same issue, and I believe it's related to the fact I'm using DaisyUI which defines it's own label css class, which is erroneously styling some of the spans. Any chance you're also using DaisyUI and/or a css framework that defines a label class?

Also @tanhauhau -- any chance that css class could be renamed?

[pmalacho-mit]

Here's my little hack (if you're issue is caused by the same thing @ZaxyxaZ ):

<div id="jsontree">
    <JSONTree value={content} />
</div>

<style>
    :global(#jsontree .label) {
        display: inline-block !important;
    }
</style>