0đź‘Ť
box-sizing: border-box;
is super nice in that you don’t have to think if that you have a width set to the element, and let’s say you add padding or a border, it “grows internally” so it wont break your layout. This is a wanted and useful in beviour in many situations. If you want to learn exactly why I could post a better scenario explaining? To get to the point 🙂
You could do either of these
1)
Throw out Vuetify and keep using border-box: content-box;
2) (recommended)
Change the rest of the app to use box-sizing: border-box;
. This is the option in what I belive would be the recommendation from most developers. That is why it’s soo widely used in the community. Depending on the scale of your app but changing to border-box: box-sizing;
and adjusting the width
and border-box: content-box;
on the elements that need it.