This page is Ready to Use

Notice: The WebPlatform project, supported by various stewards between 2012 and 2015, has been discontinued. This site is now available on github.

tab-size

Summary

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

Overview table

Initial value
8
Applies to
block containers
Inherited
Yes
Media
visual
Computed value
the specified integer or an absolute length
Animatable
No

CSS Object Model Property
:

Syntax

  • tab-size: <integer>
  • tab-size: inherit

Values

<integer>
The number of spaces in a tab. Must be positive.
inherit
Inherits from the parent element.

Examples

Example of using different tab-size.

/**
Examples of using the tab-size prop
*/

.tab--size4 {
    tab-size: 4;
}

.tab--size8 {
    tab-size: 8;
}

.tab--size12 {
    tab-size: 12;
}

.tab--size0 {
    tab-size: 0;
}

View live example

Notes

The tab character (unicode U+0009) is converted to space characters (unicode U+0020) by the white space rule (default is normal) which collapses multiple white space characters. Therefor this rule only makes sense inside a parent that cancels the white-space rule. For example the pre tag (which does this by default, setting it to pre-wrap) . See the example.

Related specifications

CSS Text Module Level 3
Editor’s draft

Attributions

  • Mozilla Developer Network cc-by-sa-small-wpd.svg: Article