Sophie: Navigation + Bild

Beitrag lesen

Hallo,

ich möchte gerne auf meiner neuen Webseite so eine Navigation inkl. Logo auf der Linken Seite gestallten? Wenn es geht ohne großes Float. Ist dieses möglich?

Beispielseite: http://sport1media.de/

Das Menü wird auf der oben genannten Seite etwas kleiner und größer. Das möchte ich nicht, das kann gerne so "klein" bleiben wie wenn man auf der Seite etwas nach unten scrollt.

Darunter möchte ich gerne ein Bild platzieren, wie es auf dieser Seite zu sehen ist https://www.dieberater.de/projekte/

Ich habe so angefangen

<!DOCTYPE html>
<html lang="de">

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width,initial-scale=1.0">
	<meta name="robots" content="index,follow">
	<meta name="description" content="">
	<meta name="keywords" content="">

	<link rel="stylesheet" type="text/css" href="themes/herbst/css/style.css">

	<title>Startseite - Example.com</title>
</head>
<body>

<header>
	<div class="container">
		<nav>
			<ul>
				<li><a href="#">Startseite</a></li>
				<li><a href="#">Leistungen</a></li>
				<li><a href="#">Wir über uns</a></li>
				<li><a href="#">Magazin</a></li>
				<li><a href="#">Kontakt</a></li>
			</ul>
		</nav>
	</div>
</header>

</body>
</html>

Und das CSS dazu

* {
	box-sizing: border-box;
}

a {
	text-decoration: none;
}

ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

body {
	margin: 0;
	padding: 0;
	border-top: 5px solid #117092
}

.container {
	max-width: 75.000em;
	margin: 0 auto;
}

Das Bild unterhalb der Navigation, packe ich dieses mit in den <header> oder soll ich darunter ein extra Bereich aufmachen mit einer <section>? Den Text darin packe ich in ein <div> oder? Und das Bild als <img> oder lieber als Background-Image?

Ich habe noch ein Online-Beispiel https://codepen.io/anon/pen/xLgrBe