tab-size
Quick Summary for tab-size
tab-size CSS property is used to customize the width of tab characters (U+0009).
Code Usage for tab-size
<pre class="brush: css notranslate"><code><span class="token comment">/ <integer> values /</span> <span class="token property">tab-size</span><span class="token punctuation">:</span> 4<span class="token punctuation">;</span> <span class="token property">tab-size</span><span class="token punctuation">:</span> 0<span class="token punctuation">;</span> <span class="token comment">/ <length> values /</span> <span class="token property">tab-size</span><span class="token punctuation">:</span> 10px<span class="token punctuation">;</span> <span class="token property">tab-size</span><span class="token punctuation">:</span> 2em<span class="token punctuation">;</span> <span class="token comment">/ Global values /</span> <span class="token property">tab-size</span><span class="token punctuation">:</span> inherit<span class="token punctuation">;</span> <span class="token property">tab-size</span><span class="token punctuation">:</span> initial<span class="token punctuation">;</span> <span class="token property">tab-size</span><span class="token punctuation">:</span> revert<span class="token punctuation">;</span> <span class="token property">tab-size</span><span class="token punctuation">:</span> unset<span class="token punctuation">;</span> </code></pre>
More Details for tab-size
tab-size
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: revert; 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.
<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> p { white-space: pre; } .custom { tab-size: 3; } Specifications
| Specification |
|---|
| CSS Text Module Level 3 # tab-size-property |
See also
Controlling size of a tab character (U+0009), an email by Anne van Kesteren to the CSSWG. Select your preferred language English (US)DeutschFrançais日本語한국어Русский中文 (简体) Change languageAdd Comment
Other Items in CSS
Related Search Terms
Other Categories in CSS
Random Quote
Apparently apple had to update the thumbnail of this video.
