width:100% bei position:absolute und margin
0 
Gernot Back
0 
Detlef G.
0
width:100% bei position:absolute und margin
Hallo!
Folgendes Problem: Wenn ich ein DIV einfach so in eine Seite setze und mit Inhalt fülle, hat es automatisch die volle Seitenbreite. Sobald ich position:absolute setze, wird gleichzeitig auch width:auto eingestellt, das DIV ist also nur noch so breit, wie es der Inhalt benötigt.
Wenn ich trotzdem die volle Breite haben will (damit z.B. der Hintergrund des DIVs bis an den rechten Rand reicht), kann ich nun zusätzlich width:100% schreiben. Wenn das DIV aber nun auch noch ein margin oder padding hat, wird dieser Rand zu den 100% addiert, das DIV ist also breiter als die Seite und ein Scrollbalken erscheint. Das ist natürlich nicht das, was man haben will.
Gibt es irgendeinen Weg, ein DIV absolut zu positionieren und trotz margin und padding die volle Seitenbreite einnehmen zu lassen?
-- snorri
Beispielcode:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Test</title>
<style type="text/css"><!--
div.textbox {
background-color: #FF0000;
}
div.oben {
position: absolute; width: 100%; margin: 0px 15px 0px 15px;
background-color: #00FF00;
}
--></style>
</head>
<body leftmargin="0" topmargin="0">
<div class="textbox">
<div class="oben">oben</div>
<br><br>
</div>
</body>
</html>
Ich hätte gerne eine Einstellung, in der der grüne Balken auch rechts 15 Pixel rot durchscheinen lässt. Ich muss ihn allerdings unbedingt absolut positionieren.
-
Hallo Snorri,
tja, bei dem, was du vorhast, hört es schon auf mit der strikten Trennung von Inhalt und Gestaltung. Da brauchst du nämlich zwei ineinander verschachtelte Blockelemente im HTML-Code: Das äußere absolut positioniert und mit Weite 100% (denk auch daran, alle Vorfahrenselemente wie z. B. auch HTML und BODY ebenfalls auf 100% zu setzen), aber mit Margin, Border und Padding auf Null. Das zweite als Kindelement da hineingesetzt mit dem Defaultwert
position:static, ohne Breitenangabe und mit dem von dir gewünschten Margin.Gruß Gernot
-
Hallo Gernot
tja, bei dem, was du vorhast, hört es schon auf mit der strikten Trennung von Inhalt und Gestaltung.
Nur aufgrund der Unfähigkeit unseres "Lieblingsbrowsers".
Sonst würde
left:0; right:0;reichen.Auf Wiederlesen
Detlef--
- Wissen ist gut
- Können ist besser
- aber das Beste und Interessanteste ist der Weg dahin! -
Mann, darauf hätt ich auch selber kommen können bei all dem Rumprobieren gestern. Danke Gernot! :-)
-- snorri
-