0

I know there seem to be a lot of questions like this, but I can't find one that matches my problem.

Even the w3schools example for centering text doesn't centre the text, (in Chrome Version 88.0.4324.104 (Official Build) (64-bit) and in Edge Version 88.0.705.50 (Official build) (64-bit)), even on the w3schools website itself. The text stays ranged left.

The code from the site is:

<!DOCTYPE html>
<html>
<head>
<style>
.center {
  margin: auto;
  width: 60%;
  border: 3px solid #73AD21;
  padding: 10px;
}
</style>
</head>
<body>

<h2>Center Align Elements</h2>
<p>To horizontally center a block element (like div), use margin: auto;</p>

<div class="center">
  <p>Hello World!</p>
</div>

</body>
</html>

So how do I centre text, if I can't even get the w3schools example to work?

Thanks.

digitig
  • 1,989
  • 3
  • 25
  • 45
  • `text-align` centers the content of an element, in your case you are centering the element, not its content. – Robert Feb 03 '21 at 01:12

2 Answers2

2

margin: auto centers the position of a block element. That div is being centered - but that only centers the box itself, not the text within the box.

text-align: center centers text (and other inline elements) within its container.

Brilliand
  • 13,404
  • 6
  • 46
  • 58
0

Apply on p tag style ="margin:auto ; width: fit-content;"

Ruchita Vani
  • 61
  • 4