ramil_bayramov
@ramil_bayramov
Beginner programmer of HTML,CSS,JS

Почему блок не идет в центр?

5f47e01f3f884046294239.png
через justify..., align-items и margin: 0 auto не работает
<body>
        <div class="div">
            <div class="div div1"></div>
            <div class="div div2"></div>
        </div>
        <div class="div">
            <div class="div div3"></div>
            <div class="div div4"></div>
        </div>
</body>

body {
    background-color: #D3D3D3;
    width: 100vh;
}
.div {
    display: flex;
    width: 350px;
    height: 170px;
    margin-right: 5px;
    border-bottom-style: solid 2px;
    margin-bottom: 5px;
    justify-content: center;
    align-items: center;
}
.div1 {
    background-color: red;
}
.div2 {
    background-color: green;
}
.div3 {
    background-color: blue;
}
.div4 {
    background-color: yellow;
}
  • Вопрос задан
  • 62 просмотра
Решения вопроса 2
sniggering_deus
@sniggering_deus Куратор тега CSS
Dance Gavin Dance - Prisoner
через justify..., align-items и margin: 0 auto не работает


Почитайте как работает выравнивание с помощью flexbox и как работает выравнивание с помощью margin: 0 auto и тогда станет понятнее. Проблема в том что вы неправильно решаете задачу.



И да... на будущее...

width: 100vh;


Для ширины есть vw, а vh применяется для высоты.
Ответ написан
ib0123456789
@ib0123456789
Parse error: syntax error, unexpected ';'
Оберни их в conatiner и флекси его
https://codepen.io/5h4dy_s/pen/BaKRrWK
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы