From b205ffed761d3ac91dde3f249982d0b28f4e5234 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bj=C3=B6rn=20Ebbinghaus?= Date: Thu, 6 Jun 2024 10:53:43 +0200 Subject: [PATCH] Layout mit CSS allein --- assets/styles/utilities.css | 16 ++++++++++++---- index.html | 22 +--------------------- 2 files changed, 13 insertions(+), 25 deletions(-) diff --git a/assets/styles/utilities.css b/assets/styles/utilities.css index 631f508..47da6e3 100644 --- a/assets/styles/utilities.css +++ b/assets/styles/utilities.css @@ -24,8 +24,19 @@ address { line-height: inherit; } +body { + height: 100dvh; /* 100% der (dynamischen) Viewport Höhe */ + display: grid; + + /* + zwei Zeilen. + Zeile 1: auto -> Der Inhalt entscheidet die Höhe. + Zeile 2: 1fr -> 1 Anteil (FRaction) des restlichen Platzes. */ + grid-template-rows: auto 1fr; +} + #map { - height: calc(100vh - var(--nav-height)); + height: 100%; /* Fülle deinen Container */ transition: 0.1s; } @@ -233,13 +244,10 @@ address { #branding { - height: 100%; display: flex; gap: 2rem; width: auto; align-items: center; - - } diff --git a/index.html b/index.html index 4118f1c..c377ed9 100644 --- a/index.html +++ b/index.html @@ -37,7 +37,7 @@ -