CSS Property: text-indent
[this page | pdf | back links]
The CSS (CSS1) text-indent property determines the
indentation applied to the first line of text in an element. Negative values
are allowed (making it possible in effect to indent all but the first line, if
the element is sized appropriately).
Valid property values
(other than inherit
and initial) are:
|
Value
|
Description
|
|
length
|
A CSS length
|
|
%
|
Indentation defined in
terms of % of width of the parent element
|
|
Default Value:
|
0
|
|
JavaScript syntax:
|
e.g. object.style.textIndent="20px"
|
|
Inherited:
|
Yes
|
|
Animatable:
|
Yes
|
EXAMPLE:
HTML USED IN THIS EXAMPLE:
<!DOCTYPE html>
<html> <!-- Copyright (c) Nematrian Limited 2018 -->
<head>
<style>
p {width: 70px; border: 2px solid red;}
.x1 {text-indent: 10px}
</style>
</head>
<body>
1. Element with default property<br>
<p>abcde fgh</p><br><br>
2. Element set using in-file HTML style<br>
<p class="x1">abcde fgh</p><br><br>
3. Element set using JavaScript<br>
<p id="x2">abcde fgh</p>
<script>
document.getElementById("x2").style.textIndent = "10px";
</script>
</body>
</html>
|
FUNCTION THAT MAY ASSIST IN TESTING WHETHER FEATURE IS SUPPORTED:
function isSupportedCSSPropertyTextIndent() {
var x = document.createElement("DIV"); x.style.textIndent = "10px"; return (window.getComputedStyle(x, null).textIndent == "10px");
} |
NAVIGATION LINKS
Contents | Prev | Next | CSS Properties