[gelöst] Bild responive machen

  • Aber das eigentlich problem ist : Der Content von Section #about soll oben und mittig sein.


    https://my2.emess62.de/

    Ich dachte, wir waren uns schon vor Tagen einig, das die beiden div's dort unnötig sind und du lieber die section, wie die anderen da drunter DIREKT benutzt.


    Also, falls nicht ganz klar ist:

    Entferne einfach die div's, gib der eigentlichen <section> die ID "about" und setze "justify-content: flex-start".

    Dann ist es so, wie von dir gewollt.

  • was genau bewirkt eigentlich in Zeile 122

    Da kann ich ändern was ich will aber es hat keine Auswirkung.

    Doch, es hat Auswirkung und setzt oben & unten einen margin von 2rem.

    Das ist allerdings (noch) nicht zu sehen, da der Inhalt in deiner <section> momentan nur aus der <h1> besteht und das "justify-content" es zentriert.

    Der margin ist für später gedacht, wenn du Inhalt hast und nicht vertikal zentrierst, damit die Überschriften oben und unten den Abstand haben.


    Beim about-Abschnitt sieht man es übrigens nicht, da du dort <h2> benutzt.

    Ändere die <h2> zu <h1>, schmeiß deine "padding-top: 20px & padding-bottom: 20px" raus und du wird sehen, das die Überschrift wunderbar oben und unten den 2rem-Abstand hat.

  • Jetzt hat es klick gemacht. Hoffentlich merk ich es mir.

    CSS
    main>section>h1
    {
        margin: 2rem 0;
       
    }

    das wirkt auf alle sections inerhalb von <main>



    CSS
    #about>h1{
        font-family: 'Courier New', Courier, monospace;
        font-style: italic;
        text-decoration: underline;
        color: blueviolet;
    }

    Das wirkt sich nur auf die <section id="#about"> aus. (Ist nur ein Beispiel)

    Ich bin echt schwer von Begriff. Und nochmal Dan für Geduld und Freundlichkeit. Ihr seid die Besten! :thumbup::thumbup::thumbup:

  • Zitat

    das wirkt auf alle sections inerhalb von <main>


    Fast. Die CSS-Angaben wirken sich auf h1-Elemente aus, die sich innerhalb von section-Elementen befinden und die sich wiederum innerhalb des main-Elements befinden. An section-Elementen selbst ändern die nichts. Genauer: Nur auf h1-Elemente, die direkte Kinder (Kindelemente) von section-Elementen sind, die wiederum direkte Kinder vom main-Element sind.


    Zitat

    Das wirkt sich nur auf die <section id="#about"> aus.


    Eher auf die enthaltenen h1-Elemente. Grundsätzlich wirken sich die Angaben auf alle h1-Elemente aus, die sich innerhalb von Containern mit der id "about" befinden. Dabei müssen die h1-Elemente direkte Kinder von Containern mit der id "about" sein. Ob es sich bei den Containern um header-, footer-, main-, nav-, section-, article-, ...-Elemente handelt spielt keine Rolle.

  • Emess

    Hat den Titel des Themas von „Bild responive machen“ zu „[gelöst] Bild responive machen“ geändert.

Jetzt mitmachen!

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