nicht angemeldet
absolute und fixe Positionierung "mischen"
Ich glaube zwar ich kenne die Antwort aber vielleicht gibt es eine Möglichkeit.
Ich habe ein horizontal zentriertes Block-Element mit fester Breite. Ich möchte links daneben ein Logo positionieren. Bei Verringerung der Viewport-Breite soll das Logo links aus dem Bild wandern und keinen Scrollbalken verursachen (der scrollbalken soll erst kommen, wenn das Block-Element nicht mehr in den viewport paßt). Das Logo soll aber (vertikal) auch nicht mitscrollen, sondern vom unteren Rand aus fix sein.
quasie position:absolute left:-100px bezogen auf das Block-Element und gleichzeitig position:fixed bottom:30px
Wie kann man das (ohne javascript) umsetzen?
-
Om nah hoo pez nyeetz, Texter mit x!
so vielleicht?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <style type="text/css"> h1 {width:500px; margin: 10px auto; position: relative;} img {position: absolute; left: -100px;} span {position: fixed; display: block;} p {width: 10em;} </style> </head> <body> <h1>Überschrift<span><img src="bla.png" width="100" height="100"></span></h1> <p>ganz viel sinnloser Text </p> <p>ganz viel sinnloser Text </p> <p>ganz viel sinnloser Text </p> <p>ganz viel sinnloser Text </p> <p>ganz viel sinnloser Text </p> <p>ganz viel sinnloser Text </p> <p>ganz viel sinnloser Text </p> <p>ganz viel sinnloser Text </p> <p>ganz viel sinnloser Text </p> <p>ganz viel sinnloser Text </p> <p>ganz viel sinnloser Text </p> <p>ganz viel sinnloser Text </p> <p>ganz viel sinnloser Text </p> <p>ganz viel sinnloser Text </p> <p>ganz viel sinnloser Text </p> <p>ganz viel sinnloser Text </p> <p>ganz viel sinnloser Text </p> </body> </html>Matthias
--
-
span { position: fixed; bottom:80px; display: block;}
img {position: absolute; left: -100px;}Paßt, danke. Ich hatte auch schon über ein Hilfselement nachgedacht aber irgendwie von der falschen Seite.
Und in einem gewissen Browser der fixed nicht kann ist das ganze nicht zu sehen, nur etwas Leerraum am Ende, paßt auch.
-