Question 366896 in Html Question posted in
Some basic documentation can be found here.

How to bring centre alignment in web page using html?

In html, what can we write in the code to bring the content of my web page in the center ?? I have tried to write the code within {center} tag and {/center} but it’s not working. so any other alternatives ??

I tried to bring centre alignment but it didn’t happen.

Tags:

3

Answers


  1. 0

    Though it’s technically still part of HTML, the <center> tag was deprecated in HTML 4.01 to emphasize that CSS stylesheets are the new home for all style and formatting parameters. That was back in 1999.

    These days, you should create a selector in CSS, then set the attributes you need for a specific effect.

    Very general example:

    .centerThisClass {
  text-align: center;
  margin: auto;
  justify-content: center;
  display: flex;
}
    Login or Signup to reply.
  2. 0

    If you want to center content in webpage only via HTML is by using center tag.

    <center>
<h2>Hello world</h2>
<img src="https://picsum.photos/200" alt="200px square image by picsum" width="200" height="200">
</center>

    However it is deprecated and is recommend to use CSS instead.

    • Centering content within the div.

      <div style = "text-align: center;">
   <h2>Inside div</h2>
   <img src="https://picsum.photos/200" alt="200px square image by picsum" width="200" height="200">
</div>

    • Centering div itself and it’s content

        <div style = "width:50%; margin: 0 auto; text-align: center;">
    <h2>Inside div</h2>
    <img src="https://picsum.photos/200" alt="200px square image by picsum" width="200" height="200">
</div>
    Login or Signup to reply.
  3. 0

    The recommended approach is to use the CSS text-align property. You can apply this property to various HTML elements like ,

    , or the entire body element to center its content.

    Here is an example:

    <!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Centered Content</title>
  <style>
    p {
      text-align: center;
    }
  </style>
</head>
<body>
  <p>This paragraph is centered horizontally on the webpage.</p>
</body>
</html>

    CSS:

    body {
  text-align: center;
}

    For more complex layouts where you want to center both horizontally and vertically, you can explore using CSS properties like margin: 0 auto; or combining text-align with other positioning properties.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search