CSS Box Sizing
Published September 22, 2015 | Categories: Web Development
.div-example {
border: 1px solid #000;
box-sizing: border-box;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
height: auto;
padding: 20px;
width: 50%;
}W3schools also goes into great detail for it, as well. Check it out. Many responsive grid frames use it as well. Since we are using more modern browsers than before such as IE9 and above, the box-sizing is a great feature and cross browser effective. If for some reason you have to use IE7, there is even a polyfill for that. It is compatible with IE8, but does have issues when using min-widths or max-widths, so percentages are best for widths in this case.
Source: CSS-Tricks
Recent Posts
