Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to align entire html body to the center?

Tags:

html

css

How do I align entire html body to the center ?

like image 544
Rajat Gupta Avatar asked Oct 16 '22 10:10

Rajat Gupta


People also ask

How do I center my whole body in HTML?

The <center> HTML element is a block-level element that displays its block-level or inline contents centered horizontally within its containing element. The container is usually, but isn't required to be, <body> .

How do I align all text to the center in HTML?

To set text alignment in HTML, use the style attribute. The style attribute specifies an inline style for an element. The attribute is used with the HTML <p> tag, with the CSS property text-align for the center, left and right alignment.

How do you center all elements in your body?

You should be using margin: 0 auto to center block level elements. This also has the advantage of not changing inline centering. thanks for your reply. I added this in <style type="text/css"> but it is just aligning the paragraphs to the left of the page (in addition to apply left-align within the paragraphs).


2 Answers

I just stumbled on this old post, and while I'm sure user01 has long since found his answer, I found the current answers don't quite work. After playing around for a little bit using info provided by the others, I found a solution that worked in IE, Firefox, and Chrome. In CSS:

html, body {
    height: 100%;
}

html {
    display: table;
    margin: auto;
}

body {
    display: table-cell;
    vertical-align: middle;
}

This is almost identical to abernier's answer, but I found that including width would break the centering, as would omitting the auto margin. I hope anyone else who stumbles on this thread will find my answer helpful.

Note: Omit html, body { height: 100%; } to only center horizontally.

like image 148
MildWolfie Avatar answered Oct 24 '22 16:10

MildWolfie


You can try:

body{ margin:0 auto; }
like image 20
arniotaki Avatar answered Oct 24 '22 15:10

arniotaki