Durchsichtiger Header

Hi, momentan sehe ich den Wald vor läuter Bäumen nicht. Ich möchte den Header, also den Bereich mit dem Logo, Konto, Merkzettel und Warenkorb, über der Navigation, gerne Transparent gestalten. Setzte ich den „container_20“ per CSS jedoch auf transparent so wird das Ganze transparent. Zum besseren Verständnis habe ich ein Bild angehangen.

Hallo, du mußt den header Bereich transparent machen, müßte bei dir in Zeile 86 der style.css stehen. mfg Frank

Hab’s probiert, hilft aber leider Nichts. Macht auch Sinn da der Container ja hinter bzw. ausserhalb dem Header liegt und der eben weiß ist. Weiterhin soll der „border“ ja auch nicht zu sehen sein was den Header angeht.

Wie hast du das Ganze denn probiert? Das sollte mit background-color:transparent; funktionieren. Das hat dann auch nichts mit dem Rahmen zu tun. mfg Frank

Das Ganze bezieht sich auf die CSS Klasse “container_20”. Setzte ich diesen Transparent, so wird der ganze Hauptcontainer transparent. Doch ich möchte ausschliesslich den Header transparent haben. Die Headerklasse auf transparent zu setzen bringt nix, da der COntainer ja weiss ist.

Ist es überhaupt möglich das per CSS zu lösen? Ich sehe da einfach keine Möglichkeit…

Hey Melodie, eigentlich schon. Probiere es mal hiermit: .container\_20 { background: transparent } #content .inner, #content .inner div#left, #content .inner div#center, #header { background: #fff } Ich würde es aber eher so machen, dass ich zwei „div“-Boxen mit .container_20 hast. Sprich eine „div“-Box um #header, #mainNavigation, #searchcontainer und #breadcrumb und die andere „div“-Box um #content. Die „div“-Box, worin sich der #header befindet, würde ich dann zusätzlich eine weitere ID geben um diesen ordentlich per CSS anzusteuern. Viele Grüße, Stephan Pohl :shopware:

Hi vielen Dank für deine Antwort. Ja ich hatte auch einen einen zusätzlichen container gedacht möchte jedoch nur ungern im Haupttemplate herumbasteln.

Ok habe nun deinen Tipp befolgt und einen zweiten Container erstellt. Funktioniert wunderbar, Danke!