How to set cell padding in HTML?

HTML Web Development Front End Technology

Cell padding is the space between cell borders and the content within a cell. 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.

HTML5 do not support the cellpadding attribute of <table>, so the CSS property padding is used with the style attribute to set cell padding.

Just keep in mind, the usage of style attribute overrides any style set globally. It will override any style set in the HTML <style> tag or external style sheet.

Example

You can try to run the following code to set cell padding in HTML. We’re also using the <style> tag and the style attribute to style the table

Live Demo

<!DOCTYPE html>
<html>
   <head>
      <style>
         table, th, td {
            border: 1px solid black;
         }
      </style>
   </head>

   <body>
      <h1>Programming Language</h1>
      <table>
         <tr>
            <th style="padding:10px">Language</th>
         </tr>
         <tr>
            <td style="padding:10px">Ruby</td>
         </tr>
      </table>
   </body>
</html>

Alankritha Ammu

Published on 01-Feb-2018 06:55:49

Previous Page Print Page