Правильно ли я использую псевдокласс :root в CSS?

Question

[Snatch08]

@media only screen and (min-width: .1px) and (max-width: 424px){

    :root{
        --Nunowone: center;
    }
}
@media only screen and (min-width: 424.1px) and (max-width: 640px){

    :root{
        --Nunowone: flex-start;
    }
}
@media only screen and (min-width: 640.1px) and (max-width: 1200px){

    :root{
        --Nunowone: center;
    }
}
@media only screen and (min-width: 1200.1px){

    :root{
        --Nunowone: flex-end;
    }
}
.Beeuwuge > div:nth-of-type(4){
    display: flex;
    flex-direction: row;
    justify-content: var(--Nunowone);
    align-items: center;
}

Answer 1

[Сергей delphinpro]

Какой-то странный вопрос. Вы точно про использование :root спрашиваете, или всё-таки про css-переменные?
Переменные вы используете правильно.
Что касается :root, то он здесь вообще ни причем. C тем же успехом можно использовать селекторы html{} или body{}, а в данном случае и .Beeuwuge{}.

Comments

[Snatch08]

Ну типо, будет ли такая запись работать и правильно ли она оформлена? Я хочу чтобы было кода было как можно меньше и чтобы расположение элемента менялось в зависимости от разрешения экрана. Я проверяю у себя и все работает. Такая запись для меня удобна, хотел бы, чтобы меня предупредили, если что не так, чтобы потом вдруг я не обнаружил проблем из-за использования такого подхода к написанию кода

[Сергей delphinpro]

Snatch08, всё правильно

[Snatch08]

Сергей delphinpro, Шикардос, благодарю)