Menu
I would like the size of my boxes not to be changed by margin and padding.
655
In the content box model, the content inside of element will have the same dimension as the element. In the border box model, the content's dimension has to subtract the border and padding from the element's dimension. Specifically, the content's width is 200 - 5 * 2 - 10 * 2 = 170px .
The box-sizing property allows us to include the padding and border in an element's total width and height. If you set box-sizing: border-box; on an element, padding and border are included in the width and height: Both divs are the same size now!
box-sizing: border-box is the default styling that browsers use for the <table> , <select> , and <button> elements, and for <input> elements whose type is radio , checkbox , reset , button , submit , color , or search .
React Native styles all views as if box-sizing: border-box is set. See this code: https://github.com/facebook/react-native/blob/5aa1fb3ff326a429e33a443576da866f2a63c20c/ReactAndroid/src/main/java/com/facebook/react/views/view/ReactViewBackgroundDrawable.java#L632
81
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
