Belajar Bareng

Berikut contoh membuat tabel div yang mempunyai 10 kolom (columns) dan 2 baris (rows).

Pertama buat wadah atau container yang fungsinya bertindak sebagai table <table></table>

<div class=”container”></div>

Property cssnya sebagai berikut

.container{
width:100%;    /* penuh layar mengikuti ukuran resolusi monitor, gunakan ukuran px untuk fixed */
margin:0 auto; /* opsional, supaya table berada di tengah jika dalam kondisi ukuran menggunakan px*/ /* bertindak seperti <table align="center">*/
border: 1px solid #000 /* border, opsional */
}
Kemudian tambahkan tag baris <tr></tr> didalam tag container tadi,yang fungsinya sebagai baris

<div class=”container”>

<div class=”baris”></baris>

</div>

Property cssnya seperti berikut
.baris{
Width:100%;
}
Kemudian tambahkan tag kolom <td></td> didalam tag baris yang fungsinya sebagai kolom
.kolom{
Width:24%;
Float:left;
}
Hasilnya ntar seperti ini

<!– /* Style Definitions */ p.MsoNormal, li.MsoNormal, div.MsoNormal {mso-style-parent:”"; margin:0in; margin-bottom:.0001pt; mso-pagination:widow-orphan; font-size:12.0pt; font-family:”Times New Roman”; mso-fareast-font-family:”Times New Roman”;} p {mso-margin-top-alt:auto; margin-right:0in; mso-margin-bottom-alt:auto; margin-left:0in; mso-pagination:widow-orphan; font-size:12.0pt; font-family:”Times New Roman”; mso-fareast-font-family:”Times New Roman”;} @page Section1 {size:8.5in 11.0in; margin:1.0in 1.25in 1.0in 1.25in; mso-header-margin:.5in; mso-footer-margin:.5in; mso-paper-source:0;} div.Section1 {page:Section1;} –>

Untuk menambahkan baris lainnya, baris kedua, ketiga dan seterusnya, cukup ulangi div baris beserta div kolom sebanyak baris yang diperlukan