# Durchsichtiger Header

**URL:** <https://forum.shopware.com/t/durchsichtiger-header/3222>\
**Category:** Shopware 3.5\
**Tags:** templates--design\
**Created:** [21. Juni 2011 um 16:58 UTC](https://forum.shopware.com/t/durchsichtiger-header/3222 "2011-06-21T16:58:54Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![Bandicood](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/bandicood/32/56_2.png) [@Bandicood](https://forum.shopware.com/u/Bandicood)\
**Post date:** [21. Juni 2011 um 16:58 UTC](https://forum.shopware.com/t/durchsichtiger-header/3222/1 "2011-06-21T16:58:54Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![taaucher](https://avatars.discourse-cdn.com/v4/letter/t/ac8455/32.png) [@taaucher](https://forum.shopware.com/u/taaucher)\
**Post date:** [21. Juni 2011 um 17:05 UTC](https://forum.shopware.com/t/durchsichtiger-header/3222/2 "2011-06-21T17:05:42Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![Bandicood](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/bandicood/32/56_2.png) [@Bandicood](https://forum.shopware.com/u/Bandicood)\
**Post date:** [21. Juni 2011 um 17:08 UTC](https://forum.shopware.com/t/durchsichtiger-header/3222/3 "2011-06-21T17:08:25Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![taaucher](https://avatars.discourse-cdn.com/v4/letter/t/ac8455/32.png) [@taaucher](https://forum.shopware.com/u/taaucher)\
**Post date:** [21. Juni 2011 um 17:18 UTC](https://forum.shopware.com/t/durchsichtiger-header/3222/4 "2011-06-21T17:18:02Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![Bandicood](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/bandicood/32/56_2.png) [@Bandicood](https://forum.shopware.com/u/Bandicood)\
**Post date:** [21. Juni 2011 um 17:43 UTC](https://forum.shopware.com/t/durchsichtiger-header/3222/5 "2011-06-21T17:43:01Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![Bandicood](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/bandicood/32/56_2.png) [@Bandicood](https://forum.shopware.com/u/Bandicood)\
**Post date:** [22. Juni 2011 um 09:35 UTC](https://forum.shopware.com/t/durchsichtiger-header/3222/6 "2011-06-22T09:35:29Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![Stephan\_Pohl](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/stephan_pohl/32/10212_2.png) [@Stephan\_Pohl](https://forum.shopware.com/u/Stephan_Pohl)\
**Post date:** [22. Juni 2011 um 19:42 UTC](https://forum.shopware.com/t/durchsichtiger-header/3222/7 "2011-06-22T19:42:14Z")

</div>

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:

---

<div class="post-metadata">

**Author:** ![Bandicood](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/bandicood/32/56_2.png) [@Bandicood](https://forum.shopware.com/u/Bandicood)\
**Post date:** [22. Juni 2011 um 19:56 UTC](https://forum.shopware.com/t/durchsichtiger-header/3222/8 "2011-06-22T19:56:18Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![Bandicood](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/bandicood/32/56_2.png) [@Bandicood](https://forum.shopware.com/u/Bandicood)\
**Post date:** [23. Juni 2011 um 14:44 UTC](https://forum.shopware.com/t/durchsichtiger-header/3222/9 "2011-06-23T14:44:59Z")

</div>

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