basti1012.bplaced.net

Du siehst gerade eine vereinfachte Darstellung unserer Inhalte. Normale Ansicht mit richtiger Formatierung.
    Ich habe das Problem, dass sich meine Website nicht an die Bildschirm Größe anpasst. Ich habe verschiedene Sachen ausprobiert. (z.B. Container).

    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>