<div class='box-sizing-example' id='content-box'></div>
<div class='box-sizing-example' id='border-box'></div>

#content-box.box-sizing-example
#border-box.box-sizing-example

@import "https://compass-style.org/files/docs/examples/compass/css3/compass/css3";
.box-sizing-example {
  background: red;
  padding: 20px;
  border: 10px solid green;
  margin: 20px;
  width: 200px; }
#content-box {
  @include box-sizing(content-box); }
#border-box {
  @include box-sizing(border-box); }

@import https://compass-style.org/files/docs/examples/compass/css3/compass/css3
.box-sizing-example
  background: red
  padding: 20px
  border: 10px solid green
  margin: 20px
  width: 200px
#content-box
  +box-sizing(content-box)
#border-box
  +box-sizing(border-box)

@charset "UTF-8";
.box-sizing-example {
  background: red;
  padding: 20px;
  border: 10px solid green;
  margin: 20px;
  width: 200px;
}
#content-box {
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  -ms-box-sizing: content-box;
  box-sizing: content-box;
}
#border-box {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}