Clara Himmel: inline-block zentrieren

Hallo,

Ich habe ein Container-Element, welches sich in der Breite dem Inhalt anpassen soll, eine klassische display:inline-block Angelegenheit also. Nun will ich diesen Container aber gleichzeitig mittig platziert wissen, sobald die Fensterbreite des Browsers die Inhaltbreite überschreitet. margin-left: auto, margin-right: auto beeindruckt den Container natürlich wenig, da er eben ein inline-block Element ist.

Wie könnte eine semantisch möglichst saubere Methode aussehen?

Ergebenst, Clara Himmel.

  1. Hi,

    Ich habe ein Container-Element, welches sich in der Breite dem Inhalt anpassen soll, eine klassische display:inline-block Angelegenheit also. Nun will ich diesen Container aber gleichzeitig mittig platziert wissen, sobald die Fensterbreite des Browsers die Inhaltbreite überschreitet.

    dann denke daran, dass inline-block sich nach außen hin verhält wie inline-Inhalt, und nur nach innen wie ein Blockelement.

    margin-left: auto, margin-right: auto beeindruckt den Container natürlich wenig, da er eben ein inline-block Element ist.

    Genau. Aber text-align:center für das Elternelement sollte es tun.

    Ergebenst,

    Du liebe Güte, so förmlich? :-)

    So long,
     Martin

    --
    Es gibt eine Theorie, die besagt, dass das Universum augenblicklich durch etwas noch Komplizierteres und Verrücktes ersetzt wird, sobald jemand herausfindet, wie es wirklich funktioniert. Es gibt eine weitere Theorie, derzufolge das bereits geschehen ist.
    - (frei übersetzt nach Douglas Adams)
    1. GRRRR, genau das habe ich befürchtet...

      Is ja eigentlich schon bemerkenswert, dass es da nach wie vor keine semantisch saubere Methode gibt - ich benötige immerhin zwei "Container-Elemente", wovon eines mithilfe der doch eigentlich falschen Aufforderung, es möge bitte den TEXT zentieren, de facto ausgetrickst wird...

      Aber dafür kann in diesem Forum natürlich niemand etwas und ich finde es nach wie vor toll, wie schnell hier die Antworten kommen, die [im Rahmen des eben Möglichen] genau zum Ziel führen.

      In diesem Sinne: vielen Dank, Martin! :)

      1. Hallo Clara Himmel,

        Is ja eigentlich schon bemerkenswert, dass es da nach wie vor keine semantisch saubere Methode gibt -

        Schon mal mit flexbox umhergespielt? Ein einfaches display:flex in Verbindung mit justify-content:center und flex-wrap:wrap sollte das Verlangte leisten.

        Bis demnächst
        Matthias

        --
        Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.