zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Runde Ecken mit Hintergrund

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 04.09.2010, 18:14
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 04.09.2010
Beiträge: 2
Phil2812 befindet sich auf einem aufstrebenden Ast
Standard 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;
}
und im Template

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)
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ä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


Alle Zeitangaben in WEZ +2. Es ist jetzt 22:42 Uhr.