Auf Thema antworten

Beitrag

[QUOTE="turtle, post: 11811, member: 3295"]
Moin Moin zusammen,

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

Ich würde das gerne via HTML einbinden. Mein Code lautet wie folgt:

<!doctype html>
<html lang = "de">
<head>
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content= Fotografie Natur Personen">
    <title> Corins Blog</title>
    <link  href="....." rel="stylesheet" type "text/css">
</head>
<body>

<html>

CSS:
body {
  font-size: 150%;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 2.0;
  background-color: #bbbbbb;
  color: rgba(14, 13, 13, 0.521);
  text-align: center;
  
}
h1 {
  font-size: 200%;
  text-align: center;
  font-weight: bolder;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 2.0;
  background-color: #bbbbbb;
  color: white;
}
nav {
  background-color: rgb(17, 17, 17);
}
nav ul {

margin: 0 auto;
  display: flex;
  list-style: none;
  color:  rgb(6, 11, 11); 
  text-align: center; 
}
nav a {
    
  text-decoration: none;
  color: rgb(250, 244, 244);
  display: block;
  padding: 0.7rem;
  margin: 0;
  margin-left:100px; 
  text-align: center;
  right: 5px;
  left: 5px;
  
}
  nav a.aktuell {
    font-weight: bold;  
}
article {
  width: 50%;
  margin: 0.rem;
  padding-bottom: 2em;
}

footer {
 
  position: absolute;
  bottom: 0px;
  width: 99%;
  background-color: rgb(17, 17, 17);
  color:  rgb(241, 235, 235);
  right: 5px;
  left: 5px;
 
  
}
img {
  
    width: 99%;
    height: auto;
    position: absolute;
    top: 230px;
    right: 5px;
    left: 5px;
    padding: 40;
}
@media screen and (max-width: 530px) {
  main {
    display: block;
  }
  article {
    width: auto;
  }
}

HAt jemand eine Idee?

Lieber Gruß!
[/QUOTE]

Authentifizierung