Seitenbreite - dynamischer Mittelblock

Ich möchte gerne die Seitenbreite dynamisch einstellen. Beispiel: linker Frame: statisch 200 px breit rechter Frame: statisch 200 px breit mittlerer Frame: mindestens 600 px, ist das Fenster aber breiter, wird dieser Bereich entsprechend dynamisch verbreitert, indem der gesamte Text neu umgebrochen wird Bei Amazon wird hier übrigens sogar das Eingabefeld für die Suche breiter. Ich konnte leider nichts dazu bei Shopware finden. Kann mir einer auf die Sprünge helfen, wie man das machen kann. Vielen Dank!

Du brauchst doch bloß abfragen ob linker, bzw. rechter Frame vorhanden sind und dementsprechend dem mittelblock eine andere CSS-Klasse mit anderer Breite zu geben… Beispiel als Pseudocode: if(links UND rechts){ mitte= breite1 } elseif(links ODER rechts){ mitte=breite2 } else{ mitte=breite3 }

Vielen Dank bbene. Ich meinte es etwas anders. Die Breite des Mittelblocks soll abhängig sein von der Größe des Browserfensters, also nicht danach, wie ich 1.000px Gesamtbreite aufteile abhängig davon, ob links oder rechts ein Frame ist. Beispiel: User öffnet Browser mit 800 px: links 200, Mitte 600, rechts abgeschnitten 1000 px: links 200, Mitte 600, rechts 200 1200 px: links 200, Mitte 800, rechts 200 Beispielhaft sei hier Amazon erwähnt: wenn man das Browserfenster aufzieht, wird der Text live umgebrochen und füllt immer das ganze Fenster aus. Die meisten Bildschirme sind ja heutzutage jenseits der 1000 px, und da sieht der breite Rande links und rechts vom Shop einfach nicht gut aus.

Hi, das hier könnte Dir weiterhelfen: http://little-boxes.de/lb1/17.2-dreispa … ayout.html Auch die Shopware-Stylesheets lassen sich dahingehend umbauen, indem die statischen Breitenangaben der entsprechenden Container im Stylesheet eben durch dynamische bzw. prozentuale Werte ersetzt werden, wie zum Beispiel: #content { max-width: 1280px; min-width: 960px; } #center { width: 100%; } div.listing { width: 100%; } #listing-3col .artbox { width: 33.33%; } An unserem (sich noch im Aufbau befindlichen) Shop lässt sich bereits erkennen, dass responsive layouts auch mit Shopware möglich sind: http://tomandhawk.com/shop/jumpers/ In Deinem Falle könntest Du es mal mit einem Konstrukt wie dem folgenden probieren (IDs müssen natürlich angepasst werden): div#wrapper { min-width: 660px; max-width: 80em; } div#links { float: left; width: 200px; } div#rechts { float: right; width: 200px; } div#mitte { margin-left: 220px; margin-right: 220px; }

1 Like