Css Grid-Layout spinnt?

2 Antworten

Vom Beitragsersteller als hilfreich ausgezeichnet

Für todo-body hast du doch gar keine grid-area explizit benannt. Das Element, auf welches der Klassenselektor todo-list zeigt, nutzt den active-Bereich.

.todo-list {
  grid-area: active;
}

PS.: Die Werte deiner beiden action-Attribute (der form-Elemente) sind invalid. Entweder du trägst eine valide URL ein oder (falls du eh auf dieselbe Seite verweisen möchtest) du lässt es ganz weg.


Leonardo06 
Beitragsersteller
 07.04.2021, 20:16

Ich habe das erstmal weggelassen, weil ich das derzeit nicht brauche.

Dennoch danke ich dir für deine Antwort.

Erstellt man eine Website, fließt ein großer Teil der Arbeit in die Platzierung der einzelnen Elemente. Das Layout soll interessant aussehen, gleichzeitig aber auch intuitiv verständlich und übersichtlich sein. Cascading Style Sheets (CSS) liefern das Werkzeug, um Websites ansprechend zu gestalten. Während man mit HTML die Inhalte rudimentär auszeichnet, verwenden Webdesigner CSS für komplexe Gestaltungen. Die Webtechnik wird beständig weiterentwickelt. Mit CSS3 sind neue Techniken hinzugekommen, die die Auszeichnungssprache auch für mobiles Internet und responsives Design nutzbar machen.

Gib das ein, damit es nicht spinnt!

<!DOCTYPE html>

<html>

<head>

<style>

.grid-container {

display: grid;

}

</style>

</head>

<body>

<div class="grid-container">

<div class="grid-item1">1</div>

<div class="grid-item2">2</div>

<div class="grid-item3">3</div>

<div class="grid-item4">4</div>

<div class="grid-item5">5</div>

<div class="grid-item6">6</div>

</div>

</body>

</html>


Leonardo06 
Beitragsersteller
 07.04.2021, 16:23

Danach habe ich nicht gefragt.