kostenloser Webspace werbefrei: lima-city


[CSS] position:fixed; + margin problem

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    raff

    raff hat kostenlosen Webspace.

    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.
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. 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
  4. 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 :wink:
  5. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!