Computer >> Computer tutorials >  >> Programming >> Javascript

How to set the vertical alignment of the content in an element with JavaScript?


To set the vertical alignment, use the verticalAlign property. Set it on top if you want to move a specific text to the top.

Example

You can try to run the following code to return the vertical alignment of the content in an element with JavaScript −

<!DOCTYPE html>
<html>
   <head>
      <style>
         table {
            border: 2px solid blue;
            width: 200px;
            height: 200px;
         }
      </style>
   </head>
   <body>
      <table>
         <tr>
            <td id = "myTable">Demo Text1</td>
         </tr>
         <tr>
            <td>Demo Text2</td>
         </tr>
         <tr>
            <td>Demo Text3</td>
         </tr>
      </table>
      <br>
      <button type = "button" onclick = "display()"> Set top position </button>
      <script>
         function display() {
            document.getElementById("myTable").style.verticalAlign="top";
         }
      </script>
   </body>
</html>