La proprietà box-sizing è utilizzato per dire al browser quali proprietà di dimensionamento includere in larghezza e altezza: se includere il border e padding o solo il contenuto del box. Ad esempio , se si desiderano che due div siano fianco a fianco, si può creare un box-sizing a "border-box" . In questo modo il browser interpreta il box con la larghezza e l'altezza specificate posizionando il margin e il padding all'interno del nostro box.
div.container {
width: 35em;
border: 1em solid;
}
div.box {
box-sizing: border-box;
width: 50%;
border: 1em solid red;
float: left;
}
<div class="container">
<div class="box">This div occupies the left half.</div>
<div class="box">This div occupies the right half.</div>
<div style="clear:both;"></div>
</div>