Related Articles

Related Articles

Set cellpadding and cellspacing in CSS
  • Last Updated : 04 Dec, 2018

Cell Padding

The cell padding is used to define the spaces between the cells and its border. If cell padding property is not apply then it will be set as default value.

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
    <head>
        <title>cell padding</title>
        <style>
            table, th, td {
                border: 2px solid green;
                text-align:center;
            }
            th, td {
                padding: 20px;
                background-color:none;
            }
              
            h1 {
            color:green;
            }
        </style>
    </head>
    <body>
        <center>
        <h1>GeeksforGeeks</h1>
        <h2>Cell Padding property</h2>
        <h3>padding: 20px;</h3>
        <table style="width:70%">
        <tr>
            <th>Firstname</th>
            <th>Lastname</th
            <th>Age</th>
        </tr>
        <tr>
            <td>Harsh</td>
            <td>Agarwal</td>
            <td>15</td>
        </tr>
        <tr>
            <td>Manas</td>
            <td>Chhabra</td>
            <td>27</td>
        </tr>
        <tr>
            <td>Ramesh</td>
            <td>Chandra</td>
            <td>28</td>
        </tr>
        </table>
        </center>
    </body>
</html>                    

chevron_right


Output:

Cell Spacing



The cell spacing is used to define the space between the cells.

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
    <head>
        <title>cell spacing property</title>
        <style>
            table, th, td {
                border: 2px solid green;
                text-align:center;
              
            }
            h1 {
            color:green;
            }
        </style>
    </head>
    <body>
        <center>
        <h1>GeeksforGeeks</h1>
        <h2>Cell Spacing property</h2>
        <h3>cellspacing = "30px"</h3>
        <table style="width:70%;"cellspacing="30px">
        <tr>
            <th>Firstname</th>
            <th>Lastname</th
            <th>Age</th>
        </tr>
        <tr>
            <td>Harsh</td>
            <td>Agarwal</td>
            <td>15</td>
        </tr>
        <tr>
            <td>Manas</td>
            <td>Chhabra</td>
            <td>27</td>
        </tr>
        <tr>
            <td>Manas</td>
            <td>Chhabra</td>
            <td>27</td>
        </tr>
        <tr>
            <td>Ramesh</td>
            <td>Chandra</td>
            <td>28</td>
        </tr>
        </table>
        </center>
    </body>
</html>                    

chevron_right


Output:

Supported Browsers: The browser supported by cell padding and cell spacing are listed below:

  • Apple Safari
  • Google Chrome
  • Firefox
  • Opera
  • Internet Explorer

full-stack-img




My Personal Notes arrow_drop_up
Recommended Articles
Page :