equal height column

dabblet.css

/**
 * equal height column
 */
 .parent {
   border: 1px solid;
   float: left;
   overflow: hidden;
 }
 .child {
   float: left;
   margin: 10px;
   width: 300px;
   background: grey;
   padding-bottom: 100px;
   margin-bottom: -100px;
 }
 p {
   border: 1px solid red;
 }

dabblet.html

<div class="parent">
  <div class="child">
    <p>Creating equal height columns with CSS. This tutorial highlights the display problems that occur with multiple column layouts </p>
  </div>
  <div class="child">
    <p>Creating equal height columns with CSS is not as easy as it may first seem. This tutorial highlights the display problems that occur with multiple column layouts, and then shows a simple solution that works in all common web browsers. The method shown here is 100% CSS hack-free</p> 
  </div>
  <div class="child">
    <p>This tutorial highlights the display problems that occur with multiple column layouts, and then shows a simple solution that works in all common web browsers. The method shown here is 100% CSS hack-free, image-free </p>
  </div>
</div>

dabblet.js

// alert('Hello world!');

settings.json

{"view":"separate","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}