Table Cellpadding Is Outdated HTML: Get The New CSS Code Now
- Attribute of
- Create An HTML Table Quickly & Easily With Our Code Example
- What does
Table Cellpadding Is Outdated HTML: Get The New CSS Code Now
do? - Was used to add padding between the contents of each table cell and the border or edge of the cell. This attribute has been deprecated and CSS should be used instead.
Adding Space Around Table Cell Contents
The cellpadding
attribute was used to specify the amount of empty space to leave between the contents of a table data cell and the edge or border of the cell. A numeric value was specified and represented the amount of pixels that should be used on all four sides of every <td>
element in the table. This attribute has been deprecated and CSS should be used instead. Our tutorial on tables will get you started styling HTML tables. To add padding around the contents of a <td>
element with CSS, you have to target the CSS itself rather than the parent table. Here’s a way you could do that by adding a class attribute to the table and using the class in the selector to only affect the <td>
elements contained in that table.
<style> .example-table td { padding: 30px; } </style> <table class="example-table"> <tr><td>First column</td><td>Second column</td><td>Third column</td></tr> <tr><td>First column</td><td>Second column</td><td>Third column</td></tr> <tr><td>First column</td><td>Second column</td><td>Third column</td></tr> </table>
Let’s see what the browser does with that code.
First column | Second column | Third column |
First column | Second column | Third column |
First column | Second column | Third column |