The overflowing table bug in Internet Explorer

SHORT VERSION: Internet Explorer tables set to width:100% bust out of their parent elements.

I know this is an old and known bug, but I've Googled it and Googled it and haven't found any answers. I've just found other questions, all without answers. A few "solutions" I found didn't work. Maybe I'm not looking hard enough or for the right thing, but I'm asking because I just can't fit it, so don't flame me for not looking first. Anyway, the problem I'm having is one I'm sure most of you have had, and if not the problem then just the browser altogether: Internet Explorer. That one person you always try to avoid but inevitably run in to. So, the table width bug. By default, tables are pretty crammed up and rather small, their width set by the size of the content in the rows. So, of course, I used width:100% to make it stretch out across its parent div. To no surprise, IE thinks th开发者_开发知识库at means it should bust out of its parent and be 100% of the page. So, I've tried a number of solutions I know personally, however none seem to work. I know there's a very simple solution out there, but I just can't find it. Could someone who's had this problem please lend me a hand?

What about trying:

#el { margin-right:-1px; }

Bit late, but probably got an answer :) I faced this problem in IE 11 (please do not support that in your apps - total time waste) and fixed by this

table {
    table-layout: fixed;
}

Give it a try and let me know if it works well for you

Update: It makes column widths fixed