The tab-size
CSS property is used to customize the width of tab characters (U+0009).
Syntax
/* <integer> values */ tab-size: 4; tab-size: 0; /* <length> values */ tab-size: 10px; tab-size: 2em; /* Global values */ tab-size: inherit; tab-size: initial; tab-size: unset;
Values
<integer>
- A multiple of the advance width of the space character (U+0020) to be used as the width of tabs. Must be nonnegative.
<length>
- The width of tabs. Must be nonnegative.
Formal definition
Initial value | 8 |
---|---|
Applies to | block containers |
Inherited | yes |
Computed value | the specified integer or an absolute length |
Animation type | a length |
Formal syntax
<integer> | <length>
Examples
Expanding by character count
pre { tab-size: 4; /* Set tab size to 4 characters wide */ }
Collapse tabs
pre { tab-size: 0; /* Remove indentation */ }
Comparing to the default size
This example compares a default tab size with a custom tab size. Note that white-space
is set to pre
to prevent the tabs from collapsing.
HTML
<p>no tab</p> <p>	default tab size of 8 characters wide</p> <p class="custom">	custom tab size of 3 characters wide</p> <p> 3 spaces, equivalent to the custom tab size</p>
CSS
p { white-space: pre; } .custom { tab-size: 3; -moz-tab-size: 3; }
Result
Specifications
Specification | Status | Comment |
---|---|---|
CSS Text Module Level 3 The definition of 'tab-size' in that specification. |
Working Draft | Initial definition |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
tab-size | Chrome
Full support
21
| Edge
Full support
79
| Firefox
Full support
4
| IE No support No | Opera
Full support
15
| Safari Full support 6.1 | WebView Android Full support 4.4 | Chrome Android
Full support
25
| Firefox Android
Full support
4
| Opera Android
Full support
14
| Safari iOS Full support 7 | Samsung Internet Android
Full support
1.5
|
<length> | Chrome Full support 42 | Edge Full support 79 | Firefox Full support 53 | IE No support No | Opera Full support 29 | Safari No support No | WebView Android Full support 56 | Chrome Android Full support 42 | Firefox Android Full support 53 | Opera Android Full support 29 | Safari iOS No support No | Samsung Internet Android Full support 4.0 |
Legend
- Full support
- Full support
- No support
- No support
- See implementation notes.
- See implementation notes.
- Requires a vendor prefix or different name for use.
- Requires a vendor prefix or different name for use.
See also
- Controlling size of a tab character (U+0009), an email by Anne van Kesteren to the CSSWG.