Tailwindcss: Helpers for box-sizing

[skollro]

Hey,

while working on my project, I found that helpers for box-sizing are missing.
If this is considered useful I'd try to contribute them :)

[taylorbryant]

You might already be aware of this, but you can create your own utilities in Tailwind. I know they're probably not intending to get 100% coverage of CSS properties because the default stylesheet would be gargantuan. However, they've done an incredible job making it simple to customize and extend the framework.

[taylorbryant]

Here's one way you could make your own box-sizing utility classes. You would just add something like this at the end of your main stylesheet. By wrapping the classes in the @responsive directive, Tailwind will automatically generate the responsive classes (i.e. md:border-box, lg:border-box).

@responsive {
  .border-box {
    box-sizing: border-box;
  }
  .content-box {
    box-sizing: content-box;
  }
}

[adamwathan]

Hey @skollro! I would recommend creating those utilities as needed for your own project right now as we don't have plans to add them by default. Thanks!

[hacknug]

@adamwathan any plans on revisiting this? I have a few sites where I've needed to add this manually and I feel like it should be a part of core just like userSelect or appearance are.