sajt

<!DOCTYPE html>
<html>
<head>
	<title>HTML5</title>
	<style type="text/css">
		header {
			background-color: darkgrey;
			padding: 10px 0 0 0;
		}
		header .logo {
			font-size: 40px;
			color: white;
			margin-left: 25px;
		}
		header .logo .pet {
			color: gold;
			font-size: 58px;
			background-color: darkgrey;
			font-weight: bold;
		}
		/*.meni {
			display: inline-block;
			background-color: lightgrey;
			color: white;
			padding: 10px;
			border: 2px solid black;
			margin-left: 0px;
			margin-right: 0px;
		}*/
		.meni {
			background-color: lightgrey;
			margin: 0px;

		}
		.meni ul {
			padding: 0;
		}
		.meni ul li {
			display: inline-block;
			list-style-type: none;
			border-right: 1px solid black;
			padding: 10px 15px;
		}
		a:link {
			color: #FFFFFF;
			text-decoration: none;
		}
		a:visited {
			color: #FFFFFF;
		}
		.content {
			float: left;
			width: 66%;
		}
		img {
			float: left;
			width: 200px;
			height: 200px;
		}
		.widget {
			float: right;
			width: 33%;
			background-color: lightgrey;

		}
		footer {
			position: absolute;
			bottom: 0;
		}
	</style>
</head>
<body>
	<header>
		<div class="logo">
			<span>HTML</span>
			<span class="pet">5</span>
		</div>
		<nav class="meni">
			<ul>
				<li><a href="#" class="active">Link 1</a></li>
				<li><a href="#">Link 2</a></li>
				<li><a href="#">Link 3</a></li>
				<li><a href="#">Link 4</a></li>
				<li><a href="#">Link 5</a></li>
			</ul>
		</nav>
	</header>

	<div class="content">
		<article>
			<div>
				<img src="image/images.png">
			</div>
			<div class="tekst"><h2>This is Lorem Ipsum Heading</h2>
				 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
				 tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
				 quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
				 consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
				 cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
				 proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
				 <a href="#">Read More</a>
			</div>
		</article>
	</div>
	<aside>
		<div class="widget">
		<h3>Sidebar Links</h3>
			<ul>
				<li>Link 1</li>
				<li>Link 2</li>
				<li>Link 3</li>
				<li>Link 4</li>
				<li>Link 5</li>
			</ul>
		</div>
		<div class="widget">
		<h3>Other Widgets</h3>
			<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
			tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
			quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
			consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
			cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
			proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
		</div>
	</aside>
	<footer>
		&copy; <a href="#">Moj Sajt</a> 2020.
	</footer>
</body>
</html>