I am use the matchHeight jquery plugin to create equal size columns. It worked great until I nested two columns within one of the columns that needs to be equal height. I am stuck on what I need to change to make it work with the nested columns.
<div class="gridrow-a">
<div class="column w4">
<h3 class="yellow">YOUR GUIDED JOURNEY</h3>
<div class="box">
<h4>A Personal & Peaceful Journey</h4>
<p>“"When it comes time to die, be not like those whose hearts are filled with the fear of death, so when their time comes they weep and pray for a little more time to live their lives over again in a different way. Sing your death song, and die like a hero going home."</p>
<p>—Aupumut, Mohican.</p>
</div>
</div>
<div class="column w10">
<h3 class="yellow">LOVE STORIES</h3>
<div class="box">
<div class="column w11">
<h4>A Loving End-of-Life Plan</h4>
<p>When we come into the world we enter with our loving family planning and creating a birth plan for our arrival. When we leave this world we can exit with the same loving care and planning, creating a death plan for our departure.</p>
<p>I guide, educate, and empower others to be prepared and authentically present, during times of your greatest joys and your deepest sadness's in life.</p>
</div>
<div class="column w11">
<h4>Uniting Soul Mates</h4>
<p>Uniting Soul Mates is my mission.
Joining couples that have been through unique journeys and lifetimes of experience to find each other. The depth and commitment of your love expressed is the most important part of your wedding ceremony. Together we create with your story, in your own language, with our own sentiment, a moment in time that will be held in your hearts forever.</p>
<p>I speak from the heart.<br>
I listen from the heart.<br>
I co-create ceremony & ritual from the heart.</p>
</div>
</div>
</div>
.gridrow-a { width: 100%; margin: 30px 0; }
.gridrow-a:after { content: " "; display: block; overflow: hidden; clear: both; height: 0; }
.gridrow-a:first-child { margin-top: 0; }
.crumbs-a + .gridrow-a { margin-bottom: 0; }
.gridrow-a.sep { margin: 0 0 40px; padding: 0 0 40px; border-bottom: 3px solid #d3d2cf; }
.gridrow-a .column { margin: 0 0 0 4.4%; float: left; min-height: 1px; position: relative; }
.gridrow-a .column + .column:last-child { float: right; margin-left: 0; }
.gridrow-a .column:first-child { margin-left: 0; }
.gridrow-a .column.centered { float: none; margin: 0 auto; }
.gridrow-a .column.w4 { width: 30.4%; }
.gridrow-a .column.w10 { width: 65.2%; }
.gridrow-a .column.w11 { width: 47.3%; }
.box {
background: url(../images/box-bkg.png) repeat;
display: inline-table;
padding:20px;
}
.box p{
font-family: 'PT Sans', sans-serif;
font-size:15px;
}
.box h4{
font-family: 'PT Sans', sans-serif;
font-weight:bold;
font-size:18px;
margin-bottom:15px;
color:#165054;
}