I think I am doing something wrong, but my table cells are not aligned. The <thead>
cells are not aligning with the <tbody>
(and <tfoot>
) cells. This happens in Chrome and Firefox (note: I'm on Linux so I don't/can't test IE.).
See jsFiddle.
$(container)
.append($("<table>")
.append($("<thaad>").html("<tr><th>ID</th><th>First name</th><th>Last name</th><th>Email</th><th>Active</th></tr>"))
.append($("<tfoot>").html("<tr><th>ID</th><th>First name</th><th>Last name</th><th>Email</th><th>Active</th></tr>"))
.append($("<tbody>").html("<tr><td>1</td><td>John</td><td>Smith</td><td>john@email.com</td><td>true</td></tr>")));
What could be the reason for this? How to fix it?
Thank you.