Bootstrap boot tables with body element "display: table"

Question

To keep my layout stretched to a full page, I use Sticky Foot Footers . This approach requires me to set the html Body to "display: table".

Everything works fine except for responsive tables in Bootstrap. They are still stretched out of the display window.

Here is an example: http://jsbin.com/wifomelabu/1/edit?html,css,js,output (minimize the browser to see the problem)

If you remove the "display: table" from the body, it works fine.

Is there a way to make responsive tables work with the body element "display: table"? Or do I need to find a new way to stretch my layout to a full page?

Answer 1

Use

td { width: 100px; } 

instead

 td { min-width: 100px; } 

See this example http://jsbin.com/jesitabiya/1/