|
|||
position:fixed am umgebenden div ausrichten
Hallo,
ich möchte einen div Container mit position:fixed innerhalb eines anderen div am rechten Rand ausrichten. Als Beispiel: HTML-Code:
<div style="position:relative;width:300px;background-color:grey;min-height:900px;margin: 0 auto;"> <div style="position:fixed;width:100px;min-height:150px;background-color:green;right:0;"></div> </div> Hab per google gesucht aber nichts gefunden. Danke. |
Sponsored Links |
Sponsored Links |
|
|||
Lässt sich der gewünschte effekt dann irgendwie ereichen?
Also zur Verdeutlichung: ich will dass der Block fix bleibt wenn man scrollt. Aber eben am rechten Rand des äußeren div und nicht der ganzen Seite. |
|
||||
Also ist das äußere div horiz. zentriert? (denn andernfalls ist es eh kein Problem.)
Dann hilft allenfalls die übliche Methode mit dem Zusammenspiel aus left und seitlichem margin: Du schiebst das fixed-Element erstmal per left: 50%; in die Mitte, und dann mit passendem margin-left (in px, den Wert kannst Du errechnen) weiter bis an den rechten Rand. Allerdings musst Du dabei in Kauf nehmen, dass die Browser bei der Umrechnung der 50% in px nicht immer wie gewünscht runden, so dass das fixed-Element je nach Viewportbreite manchmal um 1px horiz. verschoben wird. Das sollte Dein Design verkraften können. Tut es das nicht, kannst Du auch tricksen und dem fixed-Element dieselbe Breite geben wie dem äußeren div und es dann ebenfalls per margin: 0 auto; horiz. zentrieren. Dann muss sich innerhalb des fixed-Elementes ein weiteres befinden, das schmaler ist und an den rechten Rand gebracht wird (dies ist das "eigentliche" Element, um das es geht). Dann musst Du noch dafür sorgen, dass das fixed-Element, das ja die volle Breite hat, die übrigen Elemente nicht überdeckt (es hat zwar keine bg-Farbe, aber z.B. wären Links innerhalb der darunter liegenden Elementen nicht anklickbar, und Textmarkierung wäre nicht möglich etc.) - das erreichst Du per pos. rel. und ggf. z-index für die übrigen Elemente.
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten. Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.) Geändert von heiko_rs (09.09.2009 um 02:14 Uhr) |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Fragen zu CSS und Joomla | DOKTOR | CSS | 2 | 23.05.2011 20:29 |
Brauche Hilfe: Schwarzes Nichts | Zwox | CSS | 10 | 19.11.2010 17:53 |
Header entfernen | tripple | CSS | 17 | 15.06.2010 16:41 |
Schriftfarbe in den Eintragungsfeldern von jforms | Steveislucky | CSS | 2 | 16.03.2010 11:59 |
CSS Text nebeinander? | carstiee09 | CSS | 13 | 13.11.2009 20:18 |