/

HTML / CSS / JavaScript Tutorial

CSS Property: tab-size

[this page | pdf | back links]

The CSS (CSS3) tab-size property indicates size (length) of space used for the tab character.

 

Valid property values (other than inherit and initial) are:

 

Value

Description

number

Number of space characters displayed for each tab character

length

Length of tab character (not supported by major browsers)

none

User cannot resize element

vertical

User can resize height of element

 

Default Value:

8

JavaScript syntax:

e.g. object.style.tabSize="12"

Inherited:

No

Animatable:

No

 

EXAMPLE:


HTML USED IN THIS EXAMPLE:
<!DOCTYPE html>
<html> <!-- Copyright (c) Nematrian Limited 2018 -->
<head>
<style>
pre.x1 {-moz-tab-size: 12; /* for Firefox */
        o-tab-size; /* for Opera */
        tab-size: 12}
</style>
</head>
<body>
<pre>
1.	Element with default property
</pre>
<pre class="x1">
2.	Element with property set by HTML
</pre>
<pre id="x2">
3.	Element with property set by JavaScript
</pre>

<script>
var x = document.getElementById("x2");
x.style.tabSize="fixed";
</script>

</body>
</html>

FUNCTION THAT MAY ASSIST IN TESTING WHETHER FEATURE IS SUPPORTED:
function isSupportedCSSPropertyTabSize() {
  var x = document.createElement("DIV"); x.style.tabSize = "12"; return (window.getComputedStyle(x, null).tabSize == "12");
}


NAVIGATION LINKS
Contents | Prev | Next | CSS Properties


Desktop view | Switch to Mobile