HTML | DOM Style textAlignLast Property

The Style textAlignLast property in HTML DOM is used to set the alignment of the last line of the text.

Syntax:

Return the textAlignLast property:
```
object.style.textAlignLast
```

Set the textAlignLast property:

object.style.textAlignLast = "auto | left | right | center | 
justify | start | end | initial | inherit"

Property Values:

Auto: The last line is justified and left aligned in the container.
Left: The last line of the text is left aligned.
Right: The last line of the text is right aligned.
Center: The last line of the text is center-aligned.
Justify: The last line is justified(last line occupies entire width of container by inserting extra spaces between the words).
Start: The last line of the text is left aligned(if direction of text is left-to-right) and right aligned(if direction of text is right-to-left).
End: The last line of the text is right aligned(if direction of text is left-to-right) and left aligned(if direction of text is right-to-left).
Initial: Sets the last line to align by its initial value.
Inherit: The last line inherits its property from parent element.

Example 1:

<!DOCTYPE html> 

<html> 

<head> 

    <title> 

        HTML | DOM Style textAlignLast Property 

    </title> 

    <style> 

        .right { 

            text-align-last: right; 

            border: 2px solid grey; 

        } 

        .center { 

            text-align-last: center; 

            border: 2px solid black; 

        } 

    </style> 

</head> 

<body> 

    <h2 style="text-align:center"> 

       Text-align-last-Right: 

   </h2> 

    <div class="right"> 

        <!-- text-align-last: right; property -->

        <p> 

            <font color="green"> 

                GeeksForGeek 

           A Computer Science Portal for Geeks 

      </font> 

        </p> 

    </div> 

    <h2 style="text-align:center"> 

       Text-align-last-Center: 

   </h2> 

    <div class="center"> 

        <!-- text-align-last: center; property -->

        <p> 

            <font color="green"> 

                GeeksForGeek 

         A Computer Science Portal for Geeks 

      </font> 

        </p> 

    </div> 

</body> 

</html>

Output:

Example 2:

<!DOCTYPE html> 

<html> 

<head> 

    <title> 

        HTML | DOM Style textAlignLast Property 

    </title> 

    <style> 

        .justify { 

            text-align-last: justify; 

            border: 2px solid grey; 

        } 

        .start { 

            text-align-last: start; 

            border: 2px solid Green; 

        } 

    </style> 

</head> 

<body> 

    <h2 style="text-align:center"> 

       Text-align-last-Justify: 

   </h2> 

    <div class="justify"> 

        <!-- text-align-last: justify; property -->

        <p> 

            <font color="green"> 

                GeeksForGeek 

        A Computer Science Portal for Geeks 

      </font> 

        </p> 

    </div> 

    <h2 style="text-align:center"> 

       Text-align-last-Start: 

   </h2> 

    <div class="start"> 

        <!-- text-align-last: start; property -->

        <p> 

            <font color="green"> 

                GeeksForGeek 

        A Computer Science Portal for Geeks 

      </font> 

        </p> 

    </div> 

</body> 

</html>

Output:

Supported Browsers: The browser supported by HTML | DOM Style textAlignLast Property are listed be;ow:

Google Chrome 47
Edge 12
Internet Explorer 5.5
Firefox 49.0
Opera 34
Safari 16

Article Tags :

HTML

Web Technologies

HTML-DOM

HTML-Property