[CSS] position:fixed; + margin problem
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
arbeiten
ausrichtung
code
container
grad
http
idee
index
kunst
linke teil
machen
position
problem
rechte teil
relative position
safari
trick
url
verschwinden
wandern
-
hey,
ich muss grade ein 2 teiliges logo in eine webseite einbauen. der rechte teil(textmarke) soll normal beim runter scrollen verschwinden und der linke teil (bild marke) soll beim runterscrollen mit nach unten wandern.
eigentlich kein problem. "position:absolute; regelt. aber leider nur in firefox weil ich nebenbei mit margin-top/left arbeiten muss was wohl bei google chrome und safari zu problemen führt (das logo wird nicht angezeigt).
mit top:; und left:; kann ich leider nicht arbeiten weil sich dann die position je nach bildschirmgröße ändert.
mein quelltext:
<div class="headerLeftTopMenuLogo" style="margin-left:-85px; margin-top:42px; position:fixed;"> <img class="logo" src="<?php bloginfo('template_directory'); ?>/bildmarke.png" border="0" /> </div> <div class="headerLeftTopMenuLogo" style=" margin-left:-7px;"> <img class="logo" src="<?php bloginfo('template_directory'); ?>/textmarke.png" border="0" style="margin-top:42px;" /> </div>
wär super wenn einer ne lösung hätte. -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Hi,
Poisition:fixed macht immer relative Position zum Fenster, du benötigst Top/Bottom oder Left/right
Eine Idee wäre mit Prozentangaben zu arbeiten, ist aber nicht einfach. Eine JavaScript-Lösung wäre z.B. Eine Idee Wert..
// edit
Mir ist grad die Lösung eingefallen:
Container bauen, der sich über komplette Seite erstreckt und Logo bewegt. Darin baust du dir die Struktur mit Margin, wo Links/rechts/Mitte du das Logo willst, kannst auch unterelemente nehmen.
Den Container Vllt vom z-Index unter die anderen Elementen also -1
da rein nen Container mir Position relative und margins
Und da rein das Logo mit Absolute und z-Index höher
Also: äußerer Container bestimmt Top/Bottom
Innerer Mittige Ausrichtung
Und ganz innen Logo
Ist aber alles ungetestet
Grüße
Daniel
Beitrag zuletzt geändert: 15.9.2011 23:36:10 von igruber -
Erst einmal wre es gut wenn wir wüssten was sich um deinen Code herum befindet (<body>?) um DIr besser helfen u können.
Am besten ein Link zur (test-)Seite.
Warum zB kommst Du auf negative margin-Werte?
Ansonsten gibt es auch einen Trick ganz auf position:fixed zu verzichten:
http://www.cssplay.co.uk/layouts/fixit.html
Wie ich es auch auf meiner Seite mache.
Ansonsten:
Natürlich kannst Du top/left benutzen es kommt nur arauf an was rum herum ist
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage