Set cellpadding and cellspacing in CSS - GeeksforGeeks

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:
<!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>                    
Output:
Cell Spacing
The cell spacing is used to define the space between the cells.
Example:
<!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>                    
Output:
Supported Browsers: The browser supported by cell padding and cell spacing are listed below:
Apple Safari
Google Chrome
Firefox
Opera
Internet Explorer
Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML  course.
CSS-Misc
Picked
CSS
HTML
Web Technologies
HTML
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Comments
Old Comments
Top 10 Projects For Beginners To Practice HTML and CSS Skills
How to insert spaces/tabs in text using HTML/CSS?
How to create footer to stay at the bottom of a Web page?
How to update Node.js and NPM to next version ?
Types of CSS (Cascading Style Sheet)
Top 10 Projects For Beginners To Practice HTML and CSS Skills
How to insert spaces/tabs in text using HTML/CSS?
How to set the default value for an HTML <select> element ?
How to update Node.js and NPM to next version ?
How to set input type date in dd-mm-yyyy format using HTML ?