добавляется дополнительная ширина к экрану html

Question

Почему появляется полоса прокрутки по ширине, как её убрать?

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: sans-serif;
}

.formSubmit {
  width: 100vw;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

.result {
  width: 100vw;
  display: flex;
  flex-direction: column;
  align-items: center;
}

<form action="create.php" method="post" class="formSubmit">
  <label>
            <p>text</p>
            <input type="text" name="text">
            <input type="date" name="date">

            <input type="submit" value="submit">
        </label>
</form>

<div class='result'>
  <p>1</p>
  <p>2</p>
</div>

Answer 1

С учетом того, что под вашей формой с 100vh (занимающей весь экран по высоте) ниже лежит ещё и блок div.result, то логичнее всего добавить правило —
body { display: flex; flex-direction: column; }

upd: Прошу прощения, забыл сказать, что после того как назначен flex для body .formSubmit и .result больше не нуждаются в width: 100vw;. Удалите эти нюансы и всё станет на свои места.

БЛОГ НА HUSL

добавляется дополнительная ширина к экрану html

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