This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The tab-size CSS property is used to customize the width of a tab (U+0009) character.

/* <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;

Initial value8
Applies toblock containers
Computed valuethe specified integer or an absolute length
Animation typea length
Canonical orderthe unique non-ambiguous order defined by the formal grammar



The number of spaces in a tab. Must be nonnegative.
The width of a tab. Must be nonnegative.

Formal syntax

<integer> | <length>


pre {
  tab-size: 4; /* Set tab size to 4 spaces */
pre {
  tab-size: 0; /* Remove indentation */
pre {
  tab-size: 2; /* Set tab size to 2 spaces */


Specification Status Comment
CSS Text Module Level 3
The definition of 'tab-size' in that specification.
Working Draft Initial definition

Browser compatibility


FeatureChromeEdgeFirefoxInternet ExplorerOperaSafari
Basic support211 No4 -moz- 2 3 No


10.5 -o-

<length>42 No53 No29 No
FeatureAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
Basic support4.4 ? ?4 -moz- 2 3


11.5 -o-

7.1 ?
<length>56 ? ?5337 No ?

1. This property is not yet animatable.

2. See bug 737785 for the status of unprefixing this property.

3. Before Firefox 53, this property was not animatable.


See also

Document Tags and Contributors

Last updated by: fscholz,