marctrix: CSS inherit

Beitrag lesen

SELF-Forum

CSS inherit

marctrix Homepage des Autors
– Informationen zu den Bewertungsregeln

Hej Linuchs,

das ist alles viel zu kompliziert.

Versuch es erstens mit mobile first, zweitens mit Flexbox.

Das folgende CSS sollte reichen:


/* Seitenaufteilung */

body {
    display: flex;
    flex-wrap: wrap;
}
body > header,
body > footer {
   flex: 0 0 100%;
}
main {
   flex: 2 0 40em;
}
body > div,
body > aside {
   flex: 1 0 20em;
}

Das dazugehörige HTML

<!doctype html>
<html class="no-js" lang="de">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<title>Name der Seite - Name des Angebotes</title>
	<meta name="description" content="">
	<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
	<header>
		<nav></nav>
	</header>
	<div>Wozu eigentlich?</div>
	<main>
		Ein oder mehrere article
	</main>
	<aside></aside>
	<footer></footer>
</body>

Hier die Codepen-Version mit etwas Inhalt

Marc

Beitrag melden
–
Informationen zu den Bewertungsregeln