CSS durch negative relative Positionierung der Ausgabe

Ich habe einen header, mainbody-und Fußzeile. Kopf-und mainbody richtig gestylt. Jetzt für die Fußzeile will ich machen, es erscheint hinter mainbody, also habe ich verwendet:

z-index: -1;
position: relative;
top: -60px;

Dieser gibt das gewünschte Ergebnis, aber ich bekomme einen extra Raum von 60px an der Unterseite.

Wie lösche ich dieses extra Raum?

InformationsquelleAutor der Frage noobcode | 2010-02-17

  1. 26

    Paul ist richtig. margin-top: -60px; statt top: -60px;. Eine andere mögliche Lösung wäre, um die "mainbody" zu position: relative; dann zu verwenden position: absolute; bottom: 60px; auf die Fußzeile - obwohl diese woild meine die Fußzeile muss verschoben werden, im inneren "mainbody". aber solange die Eltern der Fußzeile fließt mit dem "mainbody" Sie können diese gleichen trick an, dass element statt.

    InformationsquelleAutor der Antwort prodigitalson

  2. 6

    Den "extra" - Raum an der Unterseite ist der Raum, den die Fußzeile nehmen. Relativ positionierte Elemente immer noch nehmen den gleichen Platz im layout der Seite fließen, selbst wenn Sie erscheinen woanders.

    Könnten Sie versuchen, einen negativen unteren margin auf Ihrem mainbody. Sie können finden, das heißt, Sie brauchen nicht top: -60px; auf Ihre Fußzeile.

    InformationsquelleAutor der Antwort Paul D. Waite

  3. 3

    Können Sie immer noch verwenden:

    position: relative;
top: -60px;

    für den Bereich, den Sie brauchen, aber

    margin-top: -60px;

    Abschnitt, das wird neben. In diesem Fall - footer.

    InformationsquelleAutor der Antwort Mike Shema

  4. 1

    Einen Weg, das zu erreichen wäre, um den div in ein anderes, absolute'ly positionierten div, so dass es aus dem Belegfluss.

    InformationsquelleAutor der Antwort raveren

  5. 1

    Nicht wirklich eine direkte Antwort auf deine Frage, aber je nachdem, was Sie möchten, die Anzeige hinter dem Hauptinhalt, können Sie vielleicht nur fake.

    Wenn Ihr ein Bild haben, können Sie einfach steckte es in html {} oder body {} (oder ein div, welches alle Inhalte) und richten Sie es an der Unterseite.

    InformationsquelleAutor der Antwort jeroen

  6. 0

    andere Lösung für dieses ist:

    z-index: -1;
position: relative;
top: -60px;
margin-bottom: -60px;

    top sorgt für extra-Marge und margin-bottom entfernt

    für einen Grund für h-tag-nur diese für mich gearbeitet. negative margin-top funktioniert nicht

    InformationsquelleAutor der Antwort Mantas Karanauskas

Schreibe einen Kommentar