Не могу растянуть эту полоску на всю ширину, точнее на 25-150% масштабе в браузере хром все отлично, но 175% и выше - полоса кончается раньше чем контент, вроде как исправляется через min-width: 1250px
и выше, но мне кажется это неправильно, просто хотел чтобы минимальная ширина была поменьше, да и просто хочется понять почему не растягивается на всю ширину пробовал и width:100% и т.д., уже сил нет
/* CSS Document */
* {
margin: 0;
padding: 0;
}
body {
font-family: Noto Sans, sans-serif;
background-color: #F7F7F7;
min-width: 800px;
}
img {
display: block;
}
.header {
height: 100px;
}
.nav {
height: 60px;
background-color: #FFD43E;
border-style: solid;
border-color: #7a7a7a;
border-width: 2px 0px;
}
.topinfo {
list-style: none;
height: 100px;
white-space: nowrap;
text-align: center;
}
.topinfo li {
width: 300px;
height: 100px;
display: inline-block;
}
<div class="header">
<ul class="topinfo">
<li>тут лого</li>
<li>тут название конторы</li>
<li>тут краткое инфо</li>
<li>8 800 555 3535</li>
</ul>
</div>
<div class="nav">
</div>
<p>Тут будет текст</p>