aus Neugier beschäftige ich mich seit ein paar Tagen mit CSS. Folgendes Problem tritt auf:
Ich möchte ein Hintergrundbild mit 1 Pixel Breite und 70 Pixel Höhe in der Horizontalen positionieren und ausrichten - dieses Bild dient als Übergang. Was ich bis jetzt nicht schaffe, ist, das Bild in der Breite richtig am Vorgängerelement auszurichten, sodass es daran rechts und links bündig abschliesst.
Ein Screenshot zur Verdeutlichung:
http://www.abload.de/image.php?img=versuchz3y.png
Browser der Wahl ist ein Firefox3. Hier das externe Stylesheet:
- Code: Alles auswählen
@charset "UTF-8"
* {margin: 0;}
#logo {
background-position:100px 100px;
width:402px;
height:85px;
}
#uebergang {
position:relative;
top:-90px;
left:-30px;
background-image:url(uebergang-oben.png);
background-repeat:repeat-x;
width:1138px;
height:70px;
z-index:1;
}
#contentbox {
float:right;
margin-top:50px;
margin-left:50px;
margin-right:30px;
margin-bottom:50px;
padding:30px;
width:90%;
height:90%;
background-color:#181c25;
}
.content {
margin:20px;
padding:10px;
background-color:#3c3c3c;
border-width:1px;
border-color:#6370e8;
border-style:solid;
width: 90%;
color:white;
}
Es geht also um die Elemente #contentbox und #uebergang. Im HTML sieht das so aus:
<div id="contentbox">
<div id="uebergang"></div>
<div class="content">Für Textblöcke</div>
</div>
Über eine Antwort wäre ich sehr dankbar.
Gruß, Nitra.
