p]:inline” data-streamdown=”list-item”>Download & Customize OSD Skins for DVBViewer Pro 3.9.x+ Today

Visual effect

&]:pl-6” data-streamdown=“unordered-list”>
• Bulleted list with standard disc markers rendered inside the list box.
• Each list item gains left padding (pl-6), moving content away from the marker and creating a consistent indent.
• Text inside items wraps normally; long lines break and follow the padding, avoiding overflow or horizontal scrolling.

When to use it

• You want bullets inside the content area rather than hanging outside.
• You need extra space between the bullet and the item text for clearer alignment or visual hierarchy.
• You expect multi-line list items and want wrapped lines to align under the text, not under the bullet.
• You prefer explicit Tailwind-based selectors to style li elements without adding extra classes to each li.

Example HTML

Short item.  
Long item that wraps onto multiple lines to demonstrate how wrapped lines align with the padded content instead of the bullet.  
Another item.

Tips and caveats

• Browser default list indentation may interact with pl-6; if you want precise control, combine with pl-0 on the ul and rely on the li padding.
• Some Tailwind versions or configurations may require enabling arbitrary variants for the [li&] syntax; ensure your config supports arbitrary selectors.
• For accessibility, keep sufficient contrast and spacing; padding helps readability but doesn’t replace semantic markup.

Use list-inside list-disc whitespace-normal [li&]:pl-6 to create bulleted lists where bullets sit inside the content box, list items have consistent left padding, and multi-line items wrap cleanly aligned with the text._