Menu
Let's say I wanted to create a single-rowed table with 50 pixels in between each column, but 10 pixels padding on top and the bottom.
How would I do this in HTML/CSS?
340
You can either add padding to the left of all columns except the first, or add padding to the right of all columns except the last. You should avoid adding padding to the right of the last column or to the left of the first as this will insert redundant white space.
To set cell padding in HTML, use the style attribute. The style attribute specifies an inline style for an element. The attribute is used with the HTML <table> tag, with the CSS property padding.
The space between the table cells is controlled by the CELLSPACING attribute in the TABLE tag. By setting CELLSPACING to zero, you can remove all the space between the cells of your table. This removes all the space between the cells of our table (see Figure 9). Figure 9 Our example with CELLSPACING=0.
There isn't any need for fake <td>s. Make use of border-spacing instead. Apply it like this:
HTML:
<table> <tr> <td>First Column</td> <td>Second Column</td> <td>Third Column</td> </tr> </table> CSS:
table { border-collapse: separate; border-spacing: 50px 0; } td { padding: 10px 0; } See it in action.
55
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
