Не работает свойство CSS align-content: center

Question

Не работает свойство CSS align-content: center в теге <body>

#playerNickname {
    font-size: 75px;
    padding-left: 25%;
    padding-bottom: 0%;
}

#playerId {
    padding-left: 30%;
    font-size: 25px;
    padding-top: 0%;
}

body {
    background-color: #929292;
    color: white;
    font-family: Arial, Helvetica, sans-serif;
    align-items: center;
}

.bigbox {
    background-image: linear-gradient(180deg, #fff, #ddd);
    border: rgb(61, 61, 61) 1px solid;
    border-radius: 30px 15px;
    width: 50%;
    color: black;
    align-items: center;
}

.smallbox {
    background-color: #808080;
    margin: 15px;
}

.forecast-name{
    font-size: 75px;
}

<!DOCTYPE html>
<html lang="ru">

    <head>
        <title>title</title>
        <meta charset="utf-8">
        <link rel="stylesheet" href="styles.css">
    </head>

    <body>
        <article class="bigbox">
            <h1 class="forecast-name">Прогноз погоды</h1>
            <article class="smallbox">
                <p>test</p>
            </article>
        </article>
    </body>

</html>

Результат:

Answer 1

а вы точно не спутали с text-align:center?

Answer 2

А с какого перепугу ему работать, если в коде вообще нет ни flex, ни grid?

Answer 3

Попробуйте вот так

#playerNickname {
font-size: 75px;
padding-left: 25%;
padding-bottom: 0%;
}

#playerId {
padding-left: 30%;
font-size: 25px;
padding-top: 0%;
}

body {
width: 100%;
height: 100%;
background-color: #929292;
color: white;
font-family: Arial, Helvetica, sans-serif;
display: flex;
align-items: center;
justify-content: center;
}

.bigbox {

background-image: linear-gradient(180deg, #fff, #ddd);
border: rgb(61, 61, 61) 1px solid;
border-radius: 30px 15px;
width: 50%;
color: black;
align-items: center;

}

.smallbox {
background-color: #808080;
margin: 15px;
}

.forecast-name{
font-size: 75px;
}
```

<!DOCTYPE html>
<html lang="ru">

    <head>
        <title>title</title>
        <meta charset="utf-8">
        <link rel="stylesheet" href="styles.css">
    </head>

    <body>
        <article class="bigbox">
            <h1 class="forecast-name">Прогноз погоды</h1>
            <article class="smallbox">
                <p>test</p>
            </article>
        </article>
    </body>

</html>

БЛОГ НА HUSL

Не работает свойство CSS align-content: center

Ответы (3 шт):