Как выровнять текст и input в одну линию?

Question

[pandaa]

<div class="IuSSD">
<label for="dvw">скидки</label>
<input id="dvw" type="checkbox" name="S_" class="Dpd-14">
</div>

На картинке видно что текст с чекбоксом идут не вровень.

Answer 1

[origami1024]

.IuSSD{
  display: flex;
}

Answer 2

[oelena]

.IuSSD {
display: flex;
flex-direction: row;
align-items: center; (или flex-start, flex-end)

Comments

[origami1024]

Лол тот же ответ, что у меня, только на 7 часов позже и еще 2 лишних строчки, одна из которых с опечаткой, из-за чего этот ответ даже не работает

[origami1024]

pandaa, этот ответ не работает, потому что align-item - такого св-во не существует, тут опечатка.
Обидно, когда я трудился проверял в jsfiddle и подбирал ответ, и подобрал наиболее лаконичный, а задающий вопрос даже не проверяет ни мой ответ, ни ответ, который он выбирает решением на работоспособность.

[oelena]

origami1024, благодарю, что заметили и указали на опечатку. Поправила.
Отчего же 2 строки лишние?
Явное указание что элементы выстроены в ряд и выравнивание в верстке совсем не лишние.
По своему опыту могу сказать, что задавая блоку flex - элементы внутри не встают сразу ровно

[origami1024]

oelena,

По своему опыту могу сказать, что задавая блоку flex - элементы внутри не встают сразу ровно

Тут не нужен опыт, вот песочница, нужно просто раскомментировать display: flex;
https://jsfiddle.net/3628atoh/3/