Add missing border styles to Tailwind CSS #19112
eduardconstantin
started this conversation in
Ideas
Replies: 1 comment 6 replies
-
You can already do this via arbitrary properties (no config): <div class="border-4 border-gray-400 [border-style:groove]"></div>
<div class="border-4 border-gray-400 [border-top-style:groove] [border-right-style:ridge] [border-bottom-style:inset] [border-left-style:outset]"></div> Preview in Playground @eduardconstantin Also, I’d suggest opening a feature request under Ideas so the core team can consider first-class utilities. |
Beta Was this translation helpful? Give feedback.
6 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Uh oh!
There was an error while loading. Please reload this page.
-
Currently, Tailwind provides utilities for border-solid, border-dashed, border-double and border-dotted, but some CSS border styles are missing (e.g. groove, ridge, inset, outset). These are part of the CSS spec and could be useful in certain design contexts.
https://developer.mozilla.org/en-US/docs/Web/CSS/border-style
Beta Was this translation helpful? Give feedback.
All reactions