How to Fix Table on Blogger Blogs - Adding Table in Post

Hi friends, there are many bloggers who often use table in their posts. We've added the basic table code and tried to give it a professional look. Specially if you're using blogger's default template then you should pay attention on these small issues.

Reseting and Fixing Table Code

Search for paste below css code above it.

Css

/* CSS Reset & Fix Table code */ table, tbody, thead, tr, th, td{ margin: 0; padding: 0;} table {margin:15px 0; font-family: arial, sans-serif; font-size:13px; border-collapse: collapse; width: 100%;} td, th {border: 1px solid #ddd; text-align: left; padding:8px 10px;} tr:nth-child(odd) {background: #F4F4F4;} Copy and paste below table code inside post editor & click Publish.

Html

<table> <tr><th>Edit Table Heading Here</th><th>Location</th></tr> <tr><td>Basic Description written</td><td>Moved</td></tr> <tr><td>Other material from Division</td><td>Moved</td></tr> <tr><td>Closed tags placed below</td><td>Moved</td></tr> </table> Live Demo