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
Inheritedyes
Mediavisual
Computed valuethe specified integer or an absolute length
Animation typea length
Canonical orderthe unique non-ambiguous order defined by the formal grammar

Syntax

Values

<integer>
The number of spaces in a tab. Must be nonnegative.
<length>
The width of a tab. Must be nonnegative.

Formal syntax

<integer> | <length>

Examples

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

Specifications

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

Browser compatibility

Feature Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari
Basic support 21[1] No support 4.0 (2.0)-moz[2] No support 10.60-o
15[1]
6.1
<length> 42 No support 53.0 (53.0)[3] No support 29 No support
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mini Opera Mobile Safari Mobile
Basic support 4.4 4.0 (2.0)[2] No support 5-o 11.5-o
24
7.1
<length> 56 53.0 (53.0)[3] No support No support 37 No support

[1] The property is not yet animatable.

[2] The property is currently prefixed with -moz-. It will be unprefixed in bug 737785. The property was not animatable until 53.0 (bug 1308110).

[3] This was implemented in bug 943918; in addition, tab-size is now animatable.

See also

Document Tags and Contributors

 Last updated by: mfluehr,