I'm using the grid system in the [foundation framework](http://foundation.zurb.com), with a sidebar and content area. I want to extend the height of the sidebar navigation based on the content of main part (`small-10`):

```
<div class="row">
    <div class="small-2 columns">
        <div id="side-nav">
            <ul>
                ...
            </ul>
        </div>
    </div>
    <div class="small-10 columns">
        @RenderBody()
    </div>
</div>

```

I've tried:

```
#side-nav
    {
        height:100%;
        background:#f0f0f0;
    }

```