Сделать респонсив табличку с summary

[mstdmstd]

Всем привет, Есть небольшая респонсив табличка

Spoiler

 

<div id="div_order_details_html"><div class="table-responsive dialog_table"> <table class="table table-bordered table-hover table-striped">

<thead> <tr>

<th>Product</th> <th>Sold</th> <th>Price</th> <th>Total</th>

</tr> </thead> <tbody>

<tr>

<td>

<a href="http://local-wprods.com/admin/product/edit/5" class="a_link" target="_blank">

Woo Ninja,

</a> <a href="http://local-wprods.com/admin/order/edit/14" class="a_link" target="_blank"> (00000001201702240002) </a>

</td> <td class="text-right">1</td> <td class="text-right">$20.00</td> <td class="text-right">$20.00</td>

</tr> <tr>

<td>

<a href="http://local-wprods.com/admin/product/edit/5" class="a_link" target="_blank">

Woo Ninja,

</a> <a href="http://local-wprods.com/admin/order/edit/15" class="a_link" target="_blank"> (00000001201702250001) </a>

</td> <td class="text-right">2</td> <td class="text-right">$20.00</td> <td class="text-right">$40.00</td>

</tr>

<tr>

<td>&nbsp;</td> <td class="text-right"><b>3</b></td> <td class="text-right">&nbsp;</td> <td class="text-right"><b>$60.00</b></td>

</tr> </tbody>

</table> </div></div>

 

с ограничением по высоте вертикальным скроллингом .dialog_table { max-height: 560px; overflow: scroll; } и последняя строка это summary. Но при такой реализации эта строка также уходит в скроллин, что не очень удобно. А как сделать чтобы эта последняя строка не скроллилась? Гуглом находил решения для заголовка, но не для summary. Спасибо!