Skip to content
Related Articles

Related Articles

How to align text content into center using JavaScript ?

View Discussion
Improve Article
Save Article
  • Last Updated : 05 Nov, 2021
View Discussion
Improve Article
Save Article

In this article, we will align the text content into center by using JavaScript. TWe use HTML DOM style textAlign property to set the alignment of text.

Syntax:

object.style.textAlign = "center"

The above syntax set the text alignment into center dynamically.

Example:

HTML




<!DOCTYPE html>
<html>
 
<head>
    <title>
        How to align text content into
        center using JavaScript ?
    </title>
</head>
 
<body>
    <h1 style="color: green;">GeeksforGeeks</h1>
 
    <h3>
        How to align text content into
        center using JavaScript ?
    </h3>
 
    <p id="content">
        GeeksforGeeks: A computer
        science portal for geeks
    </p>
 
 
 
 
    <button onclick="myFunction();">
        Set Alignment
    </button>
 
    <script type="text/javascript">
 
        function myFunction() {
            let txt = document.getElementById("content");
            txt.style.textAlign = "center";
        }
    </script>
</body>
 
</html>


Output:

Before Button Click:

After Button Click:

Supported Browsers: 

  • Google Chrome
  • Internet Explorer
  • Mozilla Firefox
  • Opera
  • Safari
My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!