Logogröße über ganze Breite und Verbindung mit Navigation

Hi,

bin gerade dabei von emotion auf responsive template umzustellen und komme nicht mehr weiter.

Das Logo ist sehr Breit (1100px) und hat eine Aussparung, in dem die Navigation unter dem Logo gepasst hat. Hat man früher die Seite kleiner gemacht war die Navigationsleiste fest mit dem Logo vereint. Jetzt verschiebt sich alles gegeneinander und ich ich weiß nicht wie ich das ganze fixsieren soll. Habe mit less Dateinen gearbeitet und folgendes in der HEADER.LESS geändert:

.header-main {
    .logo-main {
      width: 40%;

      .logo--shop {
        .unitize-height(177, 16);
        .unitize-width(1100);
left: 30%;
        img {
          width: 100%;
          height: auto;
        }
      }
      .logo--link {
        .unitize-height(177, 16);
        .unitize-width(1100);
	left: 30%;
      }
    }

    .shop--navigation{
      width: 60%;
    }
  }


        .header--navigation {
            right: 7.5%;
        }

Ich weiß nicht ob der Weg der Richtige ist und es wäre nett wenn mir jemand helfen könnte.

 

Danke, Gruß André

 

Ist das Layout in jeder beliebigen Fenstergröße oder in den in Shopware definierten Viewports gleich?