Всем привет! Начал изучать флексбоксы и столкнулся с проблемой не могу сделать обёртку(container/wrapper) для сайта: Есть шапка сайта:
растянутая на весь экран, в ней должна быть обертка в 1170px, что бы отцентрировать лого и навигацию. Но суть в том, что у меня лого и навигация это два флекса, container считается родительским для них и тут проблема:
.header {
background: #2d2d30;
height: 100px;
min-width: 430px;
}
.container {
display: flex;
height: 100%;
max-width: 1170px;
min-width: 130px;
margin: 0 auto;
align-items: center;
justify-content: space-between;
}
.logo {
display: flex;
width: 73px;
height: 31px;
}
.header-nav {
display: flex;
}
.nav-item {
display: flex;
color: #d5d5d5;
text-decoration: none;
text-transform: uppercase;
font-weight: bold;
font-size: 10px;
margin-left: 55px;
letter-spacing: 3px;
}
Если делать так, то всё норм, но дело в том, что мне container нужно использовать на всем сайте для центровки элементов, а блоки растягивать на всю ширину окна. Как сделать чтобы header был бы родительским для .logo и .nav, а .container просто (width:1170px; margin:0 auto;)