Open In App

HTML | DOM Style textAlignLast Property

Last Updated : 05 Aug, 2022
Comments
Improve
Suggest changes
Like Article
Like
Report
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: html
    <!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: html
    <!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

Similar Reads