Zentrieren

    Hallo liebe Experten,


    ich komm mal wieder nicht weiter.

    Ich will den folgenden Beitrag zentrieren: http://test.mcv-moemlingen.net…-ueber-uns/vorstandschaft


    Zuerst habe ich es mit dem CSS-Code

    Code
    .zentriert {
    width: 700px;
    margin: 0 auto;
}

    probiert.


    Hierdurch war alles zentriert, aber nicht mehr responsiv, da die 700 Pixel fest gelegt waren und dadurch die Fotos in der mobilen Ansicht nicht mehr untereinander erschienen sondern der Content nach recht süberstand..


    Jetzt dachte ich, dass es damit klappen würde:


    Code
    .zentriert {
    vertical-align: middle;
    margin: 0 auto;
}


    Aber die Fotos bleiben nach links ausgerichtet.


    Wie kann ich denn das Problem lösen, dass in der Desktopansicht zwei Fotos nebeneinander und zentriert dargestellt werden und in der mobilen Ansicht dann eben untereinander?


    Danke für Eure Hilfe


    Kurt

    Hallo Kurt,


    dass das 1. Beispiel nicht responsiv ist, ist eigentlich klar. Du gibst bei "width" mit "700px" einen absoluten Wert an. Versuch es doch mal mit:

    Code
    .zentriert {
    width: 100%;
    margin: 0 auto;
}

    Das sollte sich dann an den übergeordneten Container anpassen.


    Gruß


    Markus

    Mache ich direkt über den Editor (hier JCE):

    • Absatz zentrieren
    • Zwei Bilder nebeneinander da hinein
    • geeigneten Abstand rechts und links vom Bild einstellen
    • Zeilenumbruch
    • selbiges mit den nächsten zwei Bildern
    • ...

    (Mit drei Bildern >> hier zu sehen.)

    ------------------------------------------------------------
    Gruß vom Jörg
    (Lehrer ist kein Beruf sondern eine Diagnose. oops )

    Gefällt mir 1

    So, hab es mal durchgetestet.


    Leider haben die beiden Vorschläge von Markus und hechtnetz nicht zu dem gewünschten Ergebnis geführt.

    Mit dem CSS Code von anka klappte es und ich konnte alles zentrieren.


    Nochmals danke an Euch, dass ihr mir so schnell geantwortet habt.


    LG

    Kurt