How to align text content into center using JavaScript ? Last Updated : 28 Dec, 2023 Comments Improve Suggest changes Like Article Like Report In this article, we will align the text content into the center by using JavaScript. We use HTML DOM style textAlign property to set the alignment of text. The DOM style textAlign property is pretty much similar to the text-align property in the CSS, and the Dom textAlign property returns the horizontal alignment of the text in a block-level element in an HTML page and allows for changes to that alignment. Syntax:object.style.textAlign = "center"Example: This example aligns the text content into the center using JavaScript. 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 style="cursor: pointer;" id="button" onclick="myFunction();"> Set Alignment </button> <script type="text/javascript"> function myFunction() { let buttontext = document.getElementById("button"); buttontext.innerHTML = "Text center Alinged" let txt = document.getElementById("content"); txt.style.textAlign = "center"; } </script> </body> </html> Output: Comment More infoAdvertise with us Next Article How to align text content into center using JavaScript ? V vkash8574 Follow Improve Article Tags : JavaScript Web Technologies JavaScript-Questions Similar Reads How to align flexbox container into center using JavaScript ? In this article, we will set the alignment of content using JavaScript. The DOM Style alignContent property is used to align the items of a flexible container when they do not use all available space on the cross-axis.Syntax:object.style.alignContent = "center"Property Value:center: It is used to pl 1 min read How to Center an Image using text-align Property in CSS ? Aligning an image horizontally within a container can sometimes be challenging. In this article, we will explore how to center an image using the text-align property in CSS. Understanding the text-align PropertyThe text-align property in CSS is used to specify the horizontal alignment of text within 2 min read How to align items at the center of the container using CSS ? Centering items in a container using CSS involves aligning elements horizontally and vertically within a parent element. This can be done using different CSS properties and techniques, ensuring that the content appears visually centered and balanced within its container. Here are some common approac 2 min read How to horizontal align text content into center in HTML ? In this article, we will align the text content into center using HTML. We use align="center" attribute to set the text content into center. Syntax: <element_name align="center"> Contents... <element_name> The align="center" attribute is used to set the text content into center. Example 1 min read How to align items in a flex container with JavaScript ? In CSS, the align-items property is used to align elements in a flex container. This can be similarly implemented using JavaScript by selecting the specific element using a selector method and then using the alignItems property to set the alignment. This can be useful in situations where dynamically 2 min read How to change the text alignment using jQuery ? In this article, we will see how to change the text alignment of an element using jQuery. To change the text alignment of an element, we will use css() method. The css() method is used to change the style property of the selected element. Syntax: $(selector).css(property) In the below example, firs 1 min read How to place table text into center using Bootstrap? Centering table text using Bootstrap involves aligning the content of table cells to the center horizontally, enhancing the presentation and readability of data. This is achieved by using Bootstrap’s built-in classes like text-center, which apply CSS styles for quick and responsive text alignment wi 2 min read How to Align Form Elements to Center using Tailwind CSS? Form elements are parts of a webpage that let users enter information. They include things like text boxes, checkboxes, radio buttons, dropdown menus, and buttons. To center form elements using Tailwind CSS, use classes like flex, items-center, and justify-center on a parent container.These are the 2 min read How to center contents of an HTML table ? To center content in an HTML table, add text-align: center; CSS for each cell or use align="center" it in the <td> tags. This keeps text in the middle.Syntaxtext-align: left;Property ValueValuesDescriptioninitialIt is the default value.inheritIt sets the value to the parent's element property 1 min read How to align block elements to center using CSS ? Block elements are known for taking up the full line space, forcing other elements to start on a new line. This means they have a width of 100% of the webpage or container holding the block. In this article, we will explore how block elements usually behave and how to center them using CSS. Table of 3 min read Like