Skip to content

Latest commit

 

History

History
31 lines (24 loc) · 580 Bytes

escape-css-class-names.mdx

File metadata and controls

31 lines (24 loc) · 580 Bytes
category cover created tags title
Tip
/assets/tips/escape-css-class.png
2021-05-17
CSS
Escape CSS class names

CSS class names can't contain the : character. For example, it's not possible to declare the following class in CSS:

.lg:flex {
    ...;
}

However we can use the \ character to correct it:

.lg\:flex {
    ...;
}

The class name is usable in HTML as usual:

<div class="lg:flex">...</div>

Using \ to escape CSS class names has been used a lot in some CSS frameworks such as Tailwind.