Ich bin sehr neu im Bereich Web-Coding und brauche etwas Hilfe. Ich erstelle eine Webseite für eine örtliche Sportmannschaft und da deren Webseite nicht sehr gut aussieht und Wordpress nicht sehr benutzerfreundlich ist, dachte ich, dass es vielleicht einfacher wäre, es selbst zu programmieren.

Ich kann die Navigationsleiste, den Hauptinhalt und die Fußzeile auf der Seite nicht aufrufen. Ich möchte, dass die Navigationsleiste, der Hauptinhalt und die Fußzeile eingegeben werden und nur 80 % breit sind, damit Sie Hintergrundinformationen mit Bildern von Athleten aus Sportmannschaften sehen können)

#footerWrapper { max-width: 80%; max-height: 5%; margin-bottom: 20px; line-height: 30px; font-size: 0.9em; border: 0 solid #ddd; border-bottom-color: #3F8444; border-width: 1px 0;} /*Positions and Margins*/ .image { position: absolute; top:100px; left:100px; } .image-1 { position: absolute; top:20px; right: 100px; } header{ text-align: center; margin-top: 100px; margin-bottom: 100px; } main{ width: 80%; display: flex; flex-direction: row; justify-content: space-evenly; align-items: center;} footer{ position: static; left: 0; bottom: 0; width: 80%; height: 5%;} p {margin-left: 5px; margin-right: 5px;} /*Navigation*/ ul { display: flex; flex-direction: row; align-items: center; list-style-type: none; margin: 0; padding: 0; overflow: hidden; background-color: #04AA6D; width: 80%; } /*li {float: left;}*/ li a, .dropdown li a { display: block; color: white; text-align: center; padding: 14px 16px; text-decoration: none; } li a:hover, .dropdown:hover .dropbtn {background-color: #111;} li.dropdown { display: inline-block;} .dropdown-content { display:none; position: absolute; background-color: #04AA6D; color: white; min-width: 160px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0,.2); z-index: 1; } .dropdown-content a { color: white; padding: 12px 16px; text-decoration: none; display: block; text-align: left; } .dropdown-content a:hover {background-color: #111;color: white;} .dropdown:hover .dropdown-content { display: block; }