Menu
Is it possible to define the tab-width when whitespace is displayed (say within a <pre> tag or something)? I can't find anything to do this with CSS, but this seems like it would be a pretty common thing to want to do.
In my case, the tab width is so wide that it causes some of my code snippets on a page to be too wide. If I could somehow shorten the tab-width to make it fit without scrollbars it would make things much easier. (I suppose I could just replace the tabs with spaces, but ideally I would love to find a way to do this without doing that)
729
Definition and Usage. The tab-size property specifies the width of a tab character. In HTML, the tab character is usually displayed as a single space-character, except for some elements, like <textarea> and <pre>, and the result of the tab-size property will only be visible for those elements.
The default is four spaces. Sets the size in spaces of an automatic indentation. The default is four spaces. Tab characters, space characters, or both will be inserted to fill the specified size.
The tab character can be inserted by holding the Alt and pressing 0 and 9 together.
Use the tab-size property. You’ll need vendor prefixes currently. Example:
pre { -moz-tab-size: 4; -o-tab-size: 4; tab-size: 4; } See also the article on developer.mozilla.org: tab-size.
.tabstop { -moz-tab-size: 4; -o-tab-size: 4; tab-size: 4; }Unstyled tabs (browser default) <pre> one tab two tabs three tabs </pre> Styled tabs (4em) <pre class="tabstop"> one tab two tabs three tabs </pre>If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
