Ankündigung

Einklappen
Keine Ankündigung bisher.

div trotz z-index dynamisch verlängern

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • wernersbacher
    hat ein Thema erstellt div trotz z-index dynamisch verlängern.

    div trotz z-index dynamisch verlängern

    Hi, Leute!
    Ich bastel bisschen an einer Website.
    Oben ist der Header (400px hoch), dann der content, der sich automatisch nach unten verlängern kann; und eben noch den footer.

    Der Text soll schon im Header anfangen, daher habe ich den Textblock mit z-index nach oben verschoben. Klappt auch, nur wird der Content nicht mehr entsprechend lang angepasst und der Text geht über die Box!

    Seht:
    Greydesign

    Hat jemand ein Lösungsvorschlag?

  • ChrisB
    antwortet
    Zitat von wernersbacher Beitrag anzeigen
    Wenn ich den header als Hintergrundbild habe, kann ich den Container mit dem text direkt per margin ein abstand nach oben geben.
    Allerdings würde die hintergrundgrafik des text containers ja wieder den header überlappen.
    Ja ich dachte genau das wolltest du ...?


    Wenn der Text kein Hintergrundbild haben soll - dann gebe ihm keins, dann überlappt er auch nichts.

    Einen Kommentar schreiben:


  • nikosch
    antwortet
    Nein. Der BG liiegt im margin. Wenn Du nen Gelben Hintergrund setzt, kannst Du die Box ja auch verschieben, ohne dass alles gelb wird.

    Einen Kommentar schreiben:


  • wernersbacher
    antwortet
    Ja, gut möglich, ich muss wohl umgedacht haben. Nochmal:
    Wenn ich den header als Hintergrundbild habe, kann ich den Container mit dem text direkt per margin ein abstand nach oben geben.
    Allerdings würde die hintergrundgrafik des text containers ja wieder den header überlappen.

    Einen Kommentar schreiben:


  • ChrisB
    antwortet
    Zitat von wernersbacher Beitrag anzeigen
    Aja, aber wenn der div-container eine dynamische Höhe haben soll, muss dieser ja als Hintergrund des Elements bzw übgeordnetem Element sein, in dem sich der Text befindet; ansonsten hätte er ja keine Höhe!
    Dieser Satz ergibt grammatikalisch wenig Sinn.

    Und wenn das Grafik Hintergrudnd es Elements ist, überlappt das ja den Header, da der text schon höher anfangen soll.
    Welche Grafik?

    Einen Kommentar schreiben:


  • wernersbacher
    antwortet
    Aja, aber wenn der div-container eine dynamische Höhe haben soll, muss dieser ja als Hintergrund des Elements bzw übgeordnetem Element sein, in dem sich der Text befindet; ansonsten hätte er ja keine Höhe! Und wenn das Grafik Hintergrudnd es Elements ist, überlappt das ja den Header, da der text schon höher anfangen soll.
    Da ist es doch piep, ob der header als Element oder als html bzw body Hintergrund angezeigt wird!

    Einen Kommentar schreiben:


  • ChrisB
    antwortet
    Zitat von wernersbacher Beitrag anzeigen
    Wie meinst du das? 2 Hintergründe für ein Element?
    Nein, das geht mit CSS 2.1 noch gar nicht.


    Du hast die Elemente HTML und BODY, die können schon mal Hintergrundbilder bekommen, die auch positioniert werden können.
    Die Elemente deines Inhalts liegen da eh schon „drüber“, da ist also u.U. gar keine weitere Positionierung erforderlich.
    Und die „runden Ecken“ kannst du bspw. auch dem ersten/letzten Element deines Inhaltes verpassen.

    Noch mehr Grundlagenerklärungen geb' ich hier jetzt aber erst mal nicht ab; Erfahrungen mit dem Aufbau von CSS-Layouts kann jeder erst mal selber sammeln.

    Einen Kommentar schreiben:


  • wernersbacher
    antwortet
    Wie meinst du das? 2 Hintergründe für ein Element?

    Einen Kommentar schreiben:


  • ChrisB
    antwortet
    Zitat von wernersbacher Beitrag anzeigen
    Wie wäre es denn sinnvoll?
    Du könntest die einzelnen Elemente dort belassen, wo sie im normalen Fluss liegen; und ihnen dann die Hintergrundbilder derart zuweisen, dass sich der gewünschte optische Effekt ergibt.


    Ich sage ja nicht, dass man mit Positionierung/Verschiebung von Elementen nicht arbeiten darf - aber dann sollte man schon halbwegs wissen, was man tut und was sich wie auswirkt.

    Einen Kommentar schreiben:


  • wernersbacher
    antwortet
    ChrisB: Wie wäre es denn sinnvoll?
    ByStones: Das liegt wharscheinlich daran, dass das Design fertig ist und deshalb noch nicht ganz sauber ist.

    Einen Kommentar schreiben:


  • ByStones
    antwortet
    XHTML 1.0 Strict und CSS 3.0 valid.
    [Invalid] Markup Validation of http://www.unlimitedgraphics.de/templates/blackgrey/ - W3C Markup Validator

    Einen Kommentar schreiben:


  • ChrisB
    antwortet
    Zitat von wernersbacher Beitrag anzeigen
    Der Text soll schon im Header anfangen, daher habe ich den Textblock mit z-index nach oben verschoben.
    Nein, das hast du mit absoluter Positionierung und top getan.

    Absolute Positionierung ist für sowas aber kaum geeignet.

    Du könntest auf relative umstellen - dann bekommst du aber unten entsprechenden Freiraum.
    Ein negatives margin-top hätte dieses Problem nicht.


    Allerdings müsstest du m.E. da eigentlich gar nichts irgendwie durch die Gegend schieben, wenn du einfach die Vergabe der Hintergrundbilder etwas sinnvoller gestalten würdest.


    Btw.: Den Verschachtelungsfehler im HTML solltest du wenigstens noch ausbauen.

    Einen Kommentar schreiben:


  • nikosch
    antwortet
    Wo genau liegt jetzt Dein Problem?

    Einen Kommentar schreiben:

Lädt...
X