Ширина окна просмотра CSS не составляет до 100vw
Я создаю ряд <div>
элементы, использующие следующий код:
HTML:
.row_1_element{
text-align:center;
font-size:3vw;
width:20vw;
float:left;
}
<div id="row_1">
<div class="row_1_element">
Menu
</div>
<div class="row_1_element">
user
</div>
<div class="row_1_element">
profile
</div>
<div class="row_1_element">
?
</div>
<div class="row_1_element">
?
</div>
<div>
Проблема в том, что все 5 <div>
элементы не помещаются в один ряд по экрану, вместо этого 4 помещаются, а пятый переходит в следующий ряд. Это не имеет большого смысла, если 1vw составляет 1/100 ширины области просмотра, так как 5 *(20/100) = 100/100 ширины области просмотра. Поэтому должно быть достаточно места для всех 5 из них.
1 ответ
Решение
Вы должны удалить поля по умолчанию со страницы, если ваш контент охватывает все 100%:
body {
margin: 0;
}
.row_1_element {
text-align:center;
font-size:3vw;
width:20vw;
float:left;
}
<div id="row_1">
<div class="row_1_element">
Menu
</div>
<div class="row_1_element">
user
</div>
<div class="row_1_element">
profile
</div>
<div class="row_1_element">
?
</div>
<div class="row_1_element">
?
</div>
<div>