The calculations are defined in the spec. A flex item’s size with padding and flex-grow is determined by calculations in the flexbox spec. These calculations are similar to the sizing of flex items with padding and flex-shrink. Frankly, the math is quite technical and not the easiest thing in the world to understand. But if … Read more
Updated answer Here is how to change the box model used by the input/textarea/select elements so that they all behave the same way. You need to use the box-sizing property which is implemented with a prefix for each browser -ms-box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box; box-sizing:content-box; This means that the 2px difference we mentioned earlier does not exist.. … Read more