I have parent div called "box", and inside it there's a child div, "innerbox". innerboox holds text and a quote mark icon in the top left corner. However, there's an extra line / spacing at the top of the innerbox div, and I don't know how to get rid of it. I've tried border-collapse, vertical-align bottom, and line-height 0 but still to no avail. Any ideas?

The Style

```
<style>
.quote {display:block; width: 16px; height: 11px; background: url(img/quote-mark-sm.png) no-repeat 0 0; position: relative; top: 13px; left: -20px;}
.box {width: 350px; height: 350px; padding-left: 55px; float: left; padding-top: 140px; display: block; float:left; background: #CCC;}
.innerbox {width: 248px; height: 72px; display: table-cell; border: 1px solid #000;  font-family: Georgia, "Times New Roman", Times, serif; font-size: 14px; color: #000; text-align: left; vertical-align: middle; }
</style>

```

And the HTML

```
<div class="box"><div class="innerbox"><div class="quote"></div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras risus sapien, consectetur nec malesuada a, vulputate vitae leo. Donec at urna sed odio volutpat gravida a sed felis.</div></div>

```

Image file available here: <http://gabrieltomescu.com/quote-mark-sm.png>

Thanks!