|
|||
Runde Ecken mit Hintergrund
Hallo liebe Community!
Ich bin am Verzweifeln. Ich habe schon mehrere Stunden versucht mein Problem zu Lösen. Bei meiner jetzigen "Lösung" verwende ich Grafiken mit Transparenz als Ecken. Allerdings scheint die Hintergrundfarbe vom darunterliegenden div (und nicht das Hintergrundbild der Seite) durch. Zum besseren Verständnis: Seitenschema Ecke und die Ecke, wie sie wirklich aussieht: Ecke in der Praxis Wie man sieht, scheint die graue Farbe (bei der es sich übrigens um ein Bild handelt, das in alle Richtungen wiederholt wird) des "Wrappers" durch und nicht der Hintergrund (weiß/rosa/pink). Dass die Ecken so dunkel sind liegt daran, dass sowohl der Wrapper als auch die Ecken leicht transparent sind. Eigentlich haben die Ecken die gleiche Farbe wie der Wrapper. Vielen Dank im Voraus für mögliche Lösungsansätze! (Bitte keine Lösungsvorschläge mit Javascript.) Edit: Der relevante Code: Code:
.corner-top-left { background: url("{T_THEME_PATH}/images/corner-top-left.png") transparent no-repeat top left; z-index: 2; } .corner-top-right { background: url("{T_THEME_PATH}/images/corner-top-right.png") transparent no-repeat top right; z-index: 2; } .corner-bottom-left { background: url("{T_THEME_PATH}/images/corner-bottom-left.png") transparent no-repeat bottom left; z-index: 2; } .corner-bottom-right { background: url("{T_THEME_PATH}/images/corner-bottom-right.png") transparent no-repeat bottom right; z-index: 2; } #wrap-outer { margin: 0 auto; width: 1100px; padding: 0 20px; z-index: 0; background-color: transparent; } #wrap { width: 1060px; padding: 0 20px; background: url("{T_THEME_PATH}/images/bg.png") repeat; z-index: 1; } HTML-Code:
<div id="wrap-outer"> <div class="corner-top-left"> <div class="corner-top-right"> <div class="corner-bottom-left"> <div class="corner-bottom-right"> <div id="wrap"> ... </div> </div></div></div></div> </div> Geändert von Phil2812 (04.09.2010 um 18:17 Uhr) |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
IE - runde Ecken mit Transparenz ohne Grafiken? | freshUser | CSS | 19 | 17.03.2011 21:55 |
Runde Ecken mit CSS oder Bildern? | Cu Chullain | CSS | 3 | 16.04.2009 19:18 |
Div Orientierung | Leonidus | CSS | 22 | 30.05.2007 18:05 |
Runde Ecken und Transparenz: ich beiss mir die Zähne aus | Dwarf | CSS | 4 | 13.05.2007 19:10 |
Runde Box (bzw. runde Ecken) | l2107 | CSS | 3 | 08.02.2004 04:19 |