Projekt Flexbox Galerie mit Isotopen Auswahl

  • Habe gerade etwas mit der Aboutme section experimetiert.

    Dabei ist mir aufgefallen, dass der Filter Selektor noch nicht responive ist.

    Habe im Inspector etwas rumgedoktort um eine media querry zu erstellen. Das ist aber gescheitert. jedenfalls bekam ich es nicht hin.

    Deshalb dachte ich mir, dass die filter.js der schlüssel sein könnte.

    Wenn du Zeit und lust hast könntest du ja mal drüberschauen.

  • Ich werd verrückt!

    Doch zu Verständnis. Ich habe jetzt zwei ul Regeln was genau ist der feine Unterschied

    Die untere Regel betrachtet die ul als Kind. Nehme ich an?

    Aber was macht die erste? Davon abgesehen, dass sie mein Problem löst. :/

  • Dass es da schon einen Block gibt, hatte ich gar nicht gesehen. Dann brauchst Du nur das flex-wrap: wrap; in den unteren zu übernehmen und kannst auf den ersten verzichten.

    #filter>ul bedeutet, dass das ul ein direktes Kind ist während ein Leerzeichen bedeutet, dass es irgend ein Nachfahre sein kann, also auch Enkel, Urenkel etc.

    Das ist hier ganz gut beschrieben:

    CSS/Tutorials/Selektoren/Kombinator – SELFHTML-Wiki

  • Wieder code gespart.

    Habe mit Hilfe deiner verlinkten Seite "Selfhtml" sie Section "about me" angegangen und habe es auch jetzt responsive hinbekommen.

    Allerdings verzweifel ich an der Überschrift flex-item-left>h1 die baut sich einfach links vom Text auf. Ich denke das wird in meinem Fall mit jedem

    tag passieren. Ich steh da auf dem Schlauch.

    Die wilden Farben auf der Seite dienen nur meiner Orientierung um zu erkennen wo sich beim testen was ändert

    miflo.de

  • flex-item-left>h1 finde ich aber ich weiß nicht genau, was Du erreichen willst? Soll diese Überschrift über dem Text stehen? Dann musst Du entweder flex-direction: column; hinzu fügen oder einfach das display: flex; weg lassen, dann bauen sich die Elemente ohnehin übereinander auf.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!