<div class="block1">
  <p>画面幅いっぱい</p>  
</div>
<div class="block2">
  <p>親要素の幅に合わせる</p>  
</div>

div {
  text-align:center;
  color:#fff;
}

.block1 {
  background-color:#f00;
}

.block2 {
  max-width:80%;
  margin:0 auto;
  background-color:#f00;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.