ЛОР прошу помочь. Впервые сталкиваюсь с такой проблемой. Нужен правильный «true» способ сверстать макет без картинок в фоне.
Должен получиться такой header https://i.imgur.com/EjRC3Fh.png ( https://imgur.com/a/WcjUE )
Проблема в том, что только с картинкой в фоне такое возможно реализовать и то без «резиности». Как это сделать с background-color ?
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Как такое реализовать?</title>
    <style>
            body {
                background-color:#f4f4f4;
            }
            header {
                background-color:#c1c1c1;
                height:550px;
            }
            .container {
                margin: 0 auto;
                width:1024px;
                max-width:100%;
                background-color:transparent;
            }
            header .layer1 {
            }
    </style>
</head>
<body>
<header>
        <!-- [зеленый div ? или background] -->
        <div class="container">
            <div class="layer1">
                [логотип] [резиновый div c прозрачным фоном]
            </div>
        </nav>
        <!-- [синий div ? или background] -->
</header>
</body>
</html>



