Как расположить 2 блока в один ряд?

Question

[Kristal1]

Проблема тут в первом блоке. Надо расположить блок с логотипом и блок с меню в один ряд как на макете:



Как это сделать? Я пытался через контейнер wrapper с флоатами, но не получилось.

Comments

[xdevelx]

display: flex для .header .wrapper

[Kristal1]

xdevelx, мне приказали всю сетку на флоатах делать

[Ankhena]

Kristal1,

мне приказали всю сетку на флоатах делать

Пошли их подальше, пока не поздно.
Это не шутка.

[Антон Литвиненко]

Ankhena, а что за проблема с флоатами? Может проект того требует. Если понадобится могу спокойно сверстать макет на флоатах и инлайн-блоках, давно не юзал, но думаю проблем не будет. Вон вукомерс например тоже на флоатах и ничего, никто и не задумывается об этом

[Ankhena]

Антон Литвиненко, да хоть таблицами.
Но и таблицы и флоаты придуманы не для этого.

Если заказчик требует верстать заведомо костылями при наличии подходящих удобных технологий, то он либо идиот либо самодур.

[Антон Литвиненко]

Ankhena, Вполне возможны оба варианта, как и третий - необходима поддержка старых браузеров. К примеру проект для каких-нибудь бюджетных организаций. Не в данном случае, конечно, судя по макету. Холиварить можно долго и иногда приходится работать работу которая не нравится или 100% нелогичная.
Пример вот у меня был. Заказчик пожелал, чтобы принять верстку нужно было сделать все страницы что есть на сайте с правильными текстами, чтобы все ссылки работали и куда-то вели. Было 15 сверстаных макетов, стало 35 с дубликатами и куча времени на расстановку ссылок. Это все ДО интеграции в вордпресс. А так как я сайт к тому времени в принципе уже посадил, то эта тупая работа мне нафиг не упала, но если я не сдам верстку в таком виде заказчик не заплатит денег. Вот как бы и все. Хорошо что у меня почасовая оплата

[Ankhena]

Антон Литвиненко, одно дело, когда заказчик начинает вас шантажировать в конце работы, другое, когда это известно заранее.
Мое мнение, что уж до ИЕ11 можно обновиться. А если нет, то см. пункт выше.

Но это личное дело каждого какой уровень заказчиков выбирать.

Answer 1

[Andrey Vasilev]

wrapper {
 display: flex;
 justify-content: center;
}

у img(лого) убирай сходу:

/* margin-left: 200px; */
 /* float: left;

и вот так:

.header .wrapper {
 width: 1260px;
 margin: 0 auto;
}

Надеюсь, что проект не боевой - глаза щиплет. Ну а может ты отчаяный человек и пытаешься ублажить IE

Comments

[Kristal1]

мне приказали всю сетку на флоатах делать

[Andrey Vasilev]

Kristal1, майкрософт? приказали?

[Kristal1]

Andrey Vasilev, заказчик

[Kristal1]

Andrey Vasilev, могу скриншот требования заказчика показать, если ты мне не веришь

[G F]

А чем были обоснованы такие требования? Поддержкой ие5? Просто любопытно

[Andrey Vasilev]

Kristal1, сайт кваса под ие5 это сильно. Пошли их в баню

[Kristal1]

Andrey Vasilev, а есть что буду?