<style type="text/css">
table.table_spacing {
border-collapse: separate;
border-spacing: 20px 40px;
}
caption {
caption-side: top;
}
table.t1 {
border-collapse: separate;
empty-cells: hide;
}
</style>
<table class="table_spacing" border="1">
<tr>
<td>Red</td>
<td>Green</td>
</tr>
<tr>
<td>Blue</td>
<td>Yellow</td>
</tr>
</table>
<br><br>
<table border="1">
<caption>Some of Our Courses</caption>
<tr>
<th>Course name</th>
<th>Lessons</th>
<th>Quizzes</th>
</tr>
<tr>
<td>C++</td>
<td>81</td>
<td>363</td>
</tr>
<tr>
<td>JavaScript</td>
<td>48</td>
<td>144</td>
</tr>
</table>
<br><br>
<table class="t1" border="1">
<tr>
<td>HTML</td>
<td>CSS</td>
</tr>
<tr>
<td>JavaScript</td>
<td></td>
</tr>
</table>
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQ4R2Xd3htbeNFI4Z6rkl-ZOohWzqZLE39udloBPt6hNIC4yYMmqjt0LkXLjdM1B-WQj9KGdV2e2W6OOTjoJh42Zw-rxqsl92pWPUR05mCFPyJVEbqLwFNBII9xyEgAJQnacgQLYFMd5HmdU179d7A5SQQaFY4_khGaQUd_ZCbfzZvJq--LVmkgvBF/s16000/a2.png)
<style type="text/css">
table {
border-collapse: separate;
width: 100%;
border: 1px solid gray;
}
td {
border: 1px solid gray;
}
table.auto {
table-layout: auto;
}
table.fixed {
table-layout: fixed;
}
</style>
<p>Table-layout is set to <strong>auto</strong></p>
<table class="auto">
<tr>
<td width="10%">500.000.000.000.000</td>
<td width="90%">20.000</td>
</tr>
</table>
<p>Table-layout is set to <strong>fixed</strong></p>
<table class="fixed">
<tr>
<td width="10%">500.000.000.000.000</td>
<td width="90%">20.000</td>
</tr>
</table>
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgK5OZdRvXM8R2YlnOb_KSB12jUUQFChTAyRlWoMznuy7WX0K6upDWi4WFI1g-J_8Bc8tzodQ3UgQPTda3JkDpYKzi2R0ESG3Xc_9fB8JuS5jN52rWtdSMeETPzNF0cur__Eo13tKjUi5HMdEX9AHM0FtpHpL1pgBqtlFykDVBcpcsj0Z7r8xZJ7u5B/s16000/a1.png)
0 Nhận xét