Open In App

CSS tab-size Property

Last Updated : 13 Jun, 2023
Improve
Improve
Like Article
Like
Save
Share
Report

The tab-size property in CSS is used to specify the width of the tab character. The tab-size usually displays a single space character in an HTML document. Some elements like <textarea> and <pre> elements display the tab-size.

Syntax: 

tab-size: number|length|initial|inherit;

Property Value: The value of tab-size property is listed below: 

  • number: It is used to set the number of space characters in a tab. Its default value is 8.
  • length: It is used to set the length character. But it is not supported by most of the browsers.
  • initial: This property is used to set its default value.
  • inherit: It is used to inherit the property from its parent.

Example: In this example, we are using the above-explained properties.

html




<!DOCTYPE html>
<html>
<head>
    <title>tab-size Property</title>
    <style>
        /* CSS property for tab-size */
        #geeks {
 
            /* Used for Firefox support */
            -moz-tab-size: 6;
 
            /* Used for Opera 10.6-12.1 support */
            -o-tab-size: 6;
            tab-size: 6;
        }
 
        body {
            text-align: center;
        }
 
        h1 {
            color: green;
        }
    </style>
</head>
 
<body style="text-align:center">
 
    <h1 style="color:green">
        GeeksforGeeks
    </h1>
 
    <h2>
        The tab-size Property
    </h2>
 
    <!-- tab-size property used here -->
    <pre id="Geeks1">
         GeeksforGeeks: A computer science portal
   </pre>
</body>
</html>


Output: 

Supported Browsers: The browser supported by tab-size property are listed below: 

  • Google Chrome 21.0
  • Edge 79.0
  • Firefox 91.0 
  • Opera 15.0
  • Safari 7.0


Like Article
Suggest improvement
Previous
Next
Share your thoughts in the comments

Similar Reads