nicht angemeldet
Positionierung von ineinander geschachtelter Boxen
Hallo zusammen,
ich bin ziemlich ungeübt, was die Nutzung von CSS angeht. Jetzt will ich aber mal meine Seite aktualisieren. Dazu möchte ich einen Seitenkopf erstellen, der im Ganzen aus drei Teilen besteht. Der linke Teil ergibt sich aus einem Logobild, mit fester Größe, dann soll so eine Art Spacer kommen, der sich Bildschirmauflösung, Schriftgröße etc. anpasst und der zuletzt der rechte Abschluss soll wieder ein Bild sein mit fester Größe. In meinem jugendlichen Leichtsinn hab ich mir dass so (einfach) vorgestellt:
HTML:
<body>
<div id="complete">
<div id="topLine">
<div id="topRightCorner">
<div id="Logo">
<div id="topSpacer"> <p> bla </p</div>
</div>
</div>
</div>
</div>
</body>
CSS:
<style type="text/css" media="screen">
#body{
margin:0;
padding:0;
text-align:center;
font:family: Arial, Helvetica, Verdana, sans-serif;
color:#7672B2;
background: #FFFFFF;
}
#complete{
}
#topLine{
width: 65.7em;
height: 121px;
margin:0;
padding:0;
margin:0 auto:0 auto;
}
#Logo{
background: url(Bilder/Logo_HG_Bild.png) no-repeat left top;
width: 356px;
height: 121px;
margin-right: 214px;
}
#topSpacer{
background: url(Bilder/Top_Line_Spacer.png) repeat-x left top;
height: 121px;
margin-left: 356px;
}
#topRightCorner{
background: #ff0000 url(Bilder/HG_Top_Right.png) no-repeat right top;
width: 214px;
height: 121px;
}
Das Ergebnis sieht aber ganz anders aus:
Links das Logo kommt, wie es soll, der Spacer liegt auch direkt daneben, ist aber nur so breit wie der Text "bla" braucht (statt sich auf den verbleibenden Bildschirmplatz zu verteilen) und mein rechtes Bild fehlt komplett. Ich scheine eine Grundidee der Boxen nicht zu verstehen und wünsch mir schon beinahe die schönen alten Tables zurück ;-)
-
hallo,
Links das Logo kommt, wie es soll, der Spacer liegt auch direkt daneben, ist aber nur so breit wie der Text "bla" braucht (statt sich auf den verbleibenden Bildschirmplatz zu verteilen) und mein rechtes Bild fehlt komplett. Ich scheine eine Grundidee der Boxen nicht zu verstehen
Du stopfst sie alle ineinander. Mindestens die drei, auf die es dir ankommt, dürfen aber nicht ineinandergeschachtelt werden, sondern sollen offensichtlich nebeneinander liegen.
Grüße aus Berlin
Christoph S.