0

Есть макет и мне интересно как можно сверстать навигацию(белый блок сверху). Размер макета 1600px, а отступы по 210px, получается размер контента(центровщика) - 1180px. Я тут подумал как сделать лучше и ничего придумать не могу. Делать ли с центровщиком или без, если без, то лого нужно margin-left писать.

Что посоветуете ?

Макет: Макет

2
  • Это у дизайнера спрашивать надо, тут не понятно как меню выглядит. С первого згляда кажется, что нужен центровщик. 9 авг 2018 в 7:09
  • Я тренируюсь, и скачал бесплатный макет
    – Netahaki
    9 авг 2018 в 7:12

1 ответ 1

3

body {
  background-color: #f7f7f7;
}
.header {
  width: 100%;
  height: 50px;
  background-color: black;
}

.header__inner {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 100%;
  max-width: 1200px;
  margin: 0 auto;
}
.header__inner::after {
  position: absolute;
  top: 0;
  right: 200px;
  height: 100%;
  width: 100vw;
  background-color: white;
  content: '';
}
.header__logo-holder,
.header__menu-holder {
  z-index: 3;
}
.header__menu-holder {
  color: white;
}
<link href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.0/normalize.min.css" rel="stylesheet"/>
<header class="header">
  <div class="header__inner">
    <div class="header__logo-holder">
      Logo
    </div>
    <div class="header__menu-holder">
      Menu
    </div>
  </div>
</header>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.