How to use text-align in HTML-CodePudding

<!DOCTYPE html>
<html>
<head>
</head>

<body>
<style>
.writing {
    font-family:"Arial";
    color:"Black";
    font-size:"300%";
    text-align:"Center";
}

</style>

<div>
<h1 class=.writing>Run Away</h1>
</div>
</body>

</html>

I want "run away" to be centered on the page. How can I do this? I want "run away" to be centered on the page. How can I do this?

CodePudding user response：

You just have some typo's. classes are define as class='someName' and most attributes in css are not quoted. If you want to center vertically use flexbox

.writing {
  font-family: arial;
  color: black;
  font-size: 300%;
  text-align: center;
}

<!DOCTYPE html>
<html>
  <head>
  </head>

  <body>
    <div>
      <h1 class='writing'>Run Away</h1>
    </div>
  </body>

</html>

CodePudding user response：

You can use text-align:"center"; to center text in html, it will work properly, just add width:"100"; to your code, Your text will be moved to center.