Как создать контейнер центра

Question

Я хотел бы знать, как создать контейнер центра в html или bootstrap, который работает на странице вниз, возможно, как в facebook.

Answer 1

Чтобы сделать элемент всей высотой окна, вы должны установить его высоту и все ее высоты предка до 100% (включая html и body).

Для центрирования элемента по горизонтали, применять margin: 0 auto;

html, body, .main { 
 
    height: 100%; 
 
    margin: 0; 
 
} 
 
.main { 
 
    width: 400px; 
 
    margin: 0 auto; 
 
    background: rgb(200,225,250); 
 
}

<div class="main">Hello foo bar world!</div>

---

В качестве альтернативы, вы можете использовать display: inline-block и text-align: center

html, body, .main { 
 
    height: 100%; 
 
    margin: 0; 
 
} 
 
body { 
 
    text-align: center; 
 
} 
 
.main { 
 
    display: inline-block; 
 
    text-align: left; 
 
    width: 400px; 
 
    background: rgb(200,225,250); 
 
}

<div class="main">Hello foo bar world!</div>

Answer 2

Bootstrap's .container класс делает только это. Прочтите документы!