Firefox table css generate tbody killing table width

I am working on taking an IE only site and making it cross browser. Everything is looking good in IE, Chrome, and Safari. However Firefox isn't happy.

I have a table class called "datatable" it is as the nam开发者_开发百科e suggests a datatable. I am trying to get it to stretch to 100% of width of the div it's contained in. The div above is 100%. When I use firebug to check it, the table is stretching to 100%. However, the tbody that Firefox generated is not stretching to 100%. So because of that the rows in the table are as small as the tbody. So I have no idea how to fix this. I tried tbody{width:100%;} and it did nothing.

Any ideas I would greatly appreciate it.

Okay I just answered my question... inside the css there was a generic css like this...

table
{
    border:0px solid #000000;
    padding:0 0 0 0;
    border-collapse:collapse;
    border-spacing:0;
    display:block;
}

I removed the display:block and everything works great now... I had looked for that on the table.datatable definition, but did think to look for a generic one in the file...

This might be silly, but make sure you're selecting the tbody correctly

#datatable tbody{width:100%} 

I had the same issue, solved it eventually by setting the width property of the header cells (i figured that's what firefox looks at to decide the tbody width).

table.table_class th { width: 115px; }

it's an option if, like me, you don't want to mess with generic css.

Check to see if you have font-size set to something lesser than 100%.

If some browsers need display:block in <table> so ...

table {
    // Something..
    display: block;
}
body:not(:-moz-handler-blocked) table {
    display: table;
}

Example case : HTML in e-mails

Just a bit hack if you still need to preview on Firefox