Cell Classes

You can apply custom CSS classes directly to any cell using the class attribute. This is highly useful for applying targeted styles to specific cells without having to write complex CSS selectors.

Syntax

STL
{class="my-custom-class"} Content

Example

STL
#table
cols: 3

[body]
Product | Price | Status
Apple | $1.00 | {class="text-green-500 font-bold bg-green-50"} In Stock
Banana | $0.50 | {class="text-red-500 font-bold bg-red-50"} Out of Stock

How Classes Work

The class attribute is passed down by STL renderers and applied to the outer wrapper element (usually the <td> or <th> equivalent) of the cell. If you are using frameworks like Tailwind CSS, this allows you to rapidly style individual cells directly from your STL code.