HTML Table Padding & Spacing

HTML is the standard markup language for Web pages.
With HTML you can create your own Website.
HTML is easy to learn - You will enjoy it!
Post Reply
Guest

HTML Table Padding & Spacing

Post by Guest »

HTML Table Padding & Spacing


HTML tables can adjust the padding inside the cells, and also the space between the cells.



With Padding

hello
hello
hello


hello
hello
hello


hello
hello
hello



With Spacing

hello
hello
hello


hello
hello
hello


hello
hello
hello




HTML Table - Cell Padding
Cell padding is the space between the cell edges and the cell content.
By default the padding is set to 0.
To add padding on table cells, use the CSS padding property:

Example

th, td
{
  padding: 15px;
}
Try it Yourself »

To add padding only above the content, use the padding-top property.
And the others sides with the padding-bottom, padding-left,
and padding-right properties:

Example

th, td
{
  padding-top: 10px;
  padding-bottom: 20px;
  padding-left: 30px;
  padding-right: 40px;
}
Try it Yourself »


HTML Table - Cell Spacing
Cell spacing is the space between each cell.
By default the space is set to 2 pixels.
To change the space between table cells, use the CSS
border-spacing property on the table
element:

Example

table
{
  border-spacing:
30px;
}
Try it Yourself »















+1

Reference: https://www.w3schools.com/html/html_tab ... pacing.asp
Post Reply