How To Make Post Table On Blogger

Bismillaahirrahmaanirrahiim
Assalaamu'alaikum Wr Wb!

A web page or blog that contains a schedule or note to be drawn up regularly would require their support such as Microsoft Office Excel, but it is unlikely Microsoft Office Excel can be mounted on blogspot because of the lack of these features. So in this article I will provide an alternative to the bogger that require a table list or table for a blog post, post this table style or the zoom is set with CSS template that is applied into this blog and browse or list applied to articles or static pages.

I design with CSS is simple and modern, so neat and beautiful. Design modern-day like today no longer a lot of knickknacks that instead of making a beautiful but instead made it clear in a design, but the design is simple and neat is very beautiful and amazing now called minimalist. The word "Minimalist" may be pictured in your mind is something less because the word "Minim", minimal here means is simple and beautiful.
Before heading to the tutorial, maybe it helps you see the following results⇩

Result
Click To View

If you like it, let into the tutorial⇨

1. Put CSS above / before the ]]></b:skin> tags⇩

/************************************
Post Table By www.BloggerDiscreet.com
************************************/
table{border-collapse:collapse;border-spacing:0;}
.post-body table td {border:1px solid #e9e9e9;padding:10px;text-align:left;vertical-align:top;}
.post-body table th {border:1px solid #009900;padding:10px;text-align:left;vertical-align:top;background:#006600 !important;color:#fff}
.post-body td, .post-body th{vertical-align:top;text-align:left;font-size:13px;padding:3px 5px;}
.post-body th{background:#fff;font-weight:400;text-transform:uppercase;font-size:14px}
table {max-width:100%;width:100%;margin:1.5em auto;}
table.section-columns td.first.columns-cell{border-left:none}
table.section-columns{border:none;table-layout:fixed;width:100%;position:relative}
table.columns-2 td.columns-cell{width:50%}
table.columns-3 td.columns-cell{width:50%}
table.columns-4 td.columns-cell{width:30%}
table.section-columns td.columns-cell{vertical-align:top}
table.tr-caption-container{padding:4px;margin-bottom:.5em}
td.tr-caption{font-size:80%}
.post-body td img, .post-body th img {list-style:none;max-width:100%;height:auto;padding:0 !important;margin:0 !important}
.post-body table.tr-caption-container img, .post-body table.tr-caption-container img, .post-body img {list-style:none;max-width:100%;height:auto;padding:0 !important;margin:0 !important}
.post-body table.tr-caption-container td {border:none;padding:0 !important;margin:0 !important}
.post-body table caption{max-width:100%;height:auto;border:none !important;padding:0 !important}
.post-body img.video-thumbnail,.youtube-thumb{visibility:hidden !mportant;display:none !important;height:0}

2. Put the static HTML into pages or new articles in HTML mode (Not Compose) and you can adjust the writing on the head of the table and the table body to your liking⇩

<table cellpadding="0" cellspacing="0" style="text-align: left;"><tbody>
<tr> <th><b>WEBSITE</b></th> <th><b>DESCRIPTION<b></b></b></th> </tr>
<tr> <td><a href="URL/" target="_blank"><b>Title<b></b></b></a></td> <td>Description</td></tr>
</tbody></table>
</div>

3. Alhamdulillaah, tutorial is ready.