Notice: Undefined variable: root in /users/basti1012/www/index1.php on line 41
Website an Bildschirmgröße anpassen

Website an Bildschirmgröße anpassen

Ich habe das Problem, dass sich meine Website nicht an die Bildschirm Größe anpasst. Ich habe verschiedene Sachen ausprobiert. (z.B. Container).

Der hier verwendete Code

<!doctype html> <html lang = "de"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="description" content="Corin Fotografie Natur Personen"> <title> Corins Blog</title> <style> *{ margin:0; padding:0; } body { font-size: 150%; font-family: Arial, Helvetica, sans-serif; background-color: #bbbbbb; color: rgba(14, 13, 13, 0.521); display:flex; width:100%; flex-direction:column; } h1 { font-size: 200%; text-align: center; font-weight: bolder; font-family: Arial, Helvetica, sans-serif; background-color: #bbbbbb; color: white; } nav { background-color: rgb(17, 17, 17); width:100%; } nav ul { display: flex; list-style: none; } nav ul li{ flex:1; } nav a { text-decoration: none; color: rgb(250, 244, 244); display: block; padding: 0.7rem; font-size:2vw; color: white; text-align: center; } nav a.aktuell { font-weight: bold; } main{ display:flex; flex-direction:column; } footer { background-color: rgb(17, 17, 17); color: rgb(241, 235, 235); } img{ width: 90%; align-self:center; } p{ text-align:center; } </style> </head> <body> <header> <nav> <ul> <li><a href="C:\Users\Tahne\Desktop\Websites\Corins Blog\Home.html" >HOME</a></li> <li><a href="C:\Users\Tahne\Desktop\Websites\Corins Blog\Portfolio.html" >PORTFOLIO</a></li> <li><a href="C:\Users\Tahne\Desktop\Websites\Corins Blog\Preise.html" >PREISE</a></li> <li><a href="C:\Users\Tahne\Desktop\Websites\Corins Blog\Ueber mich.html" >ÜBER MICH</a></li> <li><a href= "Kontakt.html" >KONTAKT</a></li> <li><a href= "Impressum.html" >IMPRESSUM</a></li> </ul> </nav> </header> <main> <img src ="/image/eichhoernchen-2022-312196353.webp" alt = "kanufahrer" titel="Kanufahrer in Bangladesch"> <p> igendein text zum bild </p> </main> <footer > <p>© 2020 Corin Reyelt</p> </footer> </body> <html>