CSS Grid Layout

  • Hallo,


    wie muss ein Layout unter Verwendung des Grid Layout im CSS definiert werden, damit folgendes erreicht wird:


    Auf jeder Seite sollen sich links und rechts je eine Navigation befinden, sowie ein Header und ein Footer, der Mainbereich soll auf jeder Seite anderen Inhalt bekommen.


    Auf der Startseite sollen im Mainbereich ein horizontaler Bereich als Header und darunter zwei horizontale Bereiche als sections nebeneinander platziert werden, die jedoch auf den anderen Seiten natürlich nicht vorkommen.


    Für Hilfe bin ich natürlich sehr dankbar.


    LG aus Österreich.

  • Hallo, hier habe ich noch ein Positionierungsproblem:


    Nachfolgend das CSS:

    #wrapper {

    display: grid;

    grid-template-rows: 100px 1fr 100px;

    grid-template-columns: 250px 1fr 250px;

    height: 100vh;

    }


    header {

    background: #000066;

    grid-column-start: 1;

    grid-column-end: 4;

    grid-row-start: 1;

    grid-row-end: 2;

    }


    .flex {

    display: flex;

    justify-content: center;

    align-items: center;

    }



    Und hier das html:

    <div id="wrapper">

    <header role="banner">

    <div class="flex"><img src="../../bilder/logo_zander_animiert.gif" width="110" height="85" alt=""/><img src="../../bilder/animierter_zander_von_links_nach_rechts.gif" width="120" height="92" alt="Zander von links nach rechts"/><img src="../../banner-Dateien/image001.gif" alt="Logo Verein" width="414" height="48" /><img src="../../bilder/animierter_zander_von_rechts_nach_links.gif" width="120" height="92" alt=""/><img src="../../bilder/logo_zander_animiert.gif" width="110" height="85" alt=""/></div></header></div>


    Wie muss ich jetzt das CSS ändern, damit die beiden "Bilder/logo_zander_animiert.gif" links und rechts am Rand stehen und nicht auch zentriert werden, wie das Logo und die beiden Zander, die sich hin und her bewegen?


    Danke für Eure Hilfe.

  • Alles unter dem Strich ist eine Signatur!


    Die Deutsche Rechtschreibung ist Freeware, sprich, du darfst sie kostenlos nutzen. Allerdings ist sie nicht Open Source, d.h. du darfst sie nicht verändern oder in veränderter Form veröffentlichen!


    Zitat von Dieter Nuhr: "Wenn man keine Ahnung hat, einfach mal Fresse halten". Wie recht er doch hat...

  • Sorry, wusste nicht dass das verboten ist. Aber toll, dass Dir das gleich aufgefallen ist! Sehr aufmerksam!!! Beim Angeln bin ich zeitweise in 6 Foren unterwegs. Da regt sich niemand auf, wenn man dort das gleiche fragt.


    Mir geht es darum, um Hilfe zu bitten, die ich so natürlich leichter bekomme.


    LG aus Österreich.

  • Zitat

    Mir geht es darum, um Hilfe zu bitten, die ich so natürlich leichter bekomme.

    Für dich als Fragesteller ist es natürlich angenehm, möglichst viele Helfer mit deinem Problem zu beschäftigen, aber für die Helfer weniger: Die Erfahrung lehrt, dass der Fragesteller glücklich ist, wenn er eine Lösung in einem Forum bekommt. Die Helfer in anderen Foren bleiben häufig auf ihren Beiträgen sitzen, weil der Fragesteller nicht mehr gesehen ward.

  • Ok, mein Fehler, also dann haben wir das jetzt besprochen!! Das verstehe ich auch, habe mich aber bisher auch bei jedem Helfer bedankt, egal in welchem Forum ich eine Antwort erhalte. Das gehört für mich ganz einfach zum guten Ton. Was ich von einem Forum eigentlich nicht gewohnt bin, ist diese kindische Art, jemanden zu verpetzen, der einfach nur eine Frage gestellt hat. Das kommt mir vor wie im Kindergarten, aber Ok - jeder soll so reagieren wie er glaubt.


    Danke trotzdem vorab für die Hilfe.