Display Inline-Block

Displaying boxes using inline-block

by Alan Jones

HTML

<div #id="wrapper">
  <div class="block">
    Block 1
  </div>
  <div class="block">
    Block 2
  </div>
  <div class="block">
    Block 3
  </div>
  <div class="block">
    Block 4
  </div>
</div>

CSS

.block { 
  width:30%;
  background:#000;
  color:#fff;
  padding:20px 4%;
  margin:20px 4%;
  display: inline-block;
}