Poklikałem i takie coś mi wyszło:
<!DOCTYPE HTML>
<html lang="pl">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title>ASD</title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<!-- <link rel="stylesheet" href="style.css" type="text/css"/>
<link rel="stylesheet" href="size.css" type="text/css"/>
-->
<link href="https://fonts.googleapis.com/css?family=Sansita&subset=latin-ext" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Roboto:900i&subset=latin-ext" rel="stylesheet">
<script src="timer.js"></script>
<style>
body {
font-family: 'Sansita', sans-serif;
background-color: #CCB986;
font-size: 13px;
}
@media screen and (min-width: 770px) {
body {
font-size: 20px;
}
}
@media screen and (min-width: 910px) {
body {
font-size: 25px;
}
}
.logo {
margin-left: auto;
margin-right: auto;
width: 200px;
height: 200px;
margin-bottom: 20px;
}
.container {
min-width:600px;
max-width:1800px;
margin-left: auto;
margin-right: auto;
}
.header {
padding: 15px;
background-color: #663300;
color: white;
font-family: 'Sansita', sans-serif;
font-size: 40px;
}
.left,
.right {
width: 15%;
}
ul {
padding-left: 0px;
}
li {
color: white;
font-weight: bold;
background-color: #663300;
list-style-type: none;
margin-left: auto;
margin-right: auto;
margin-top: 10px;
max-height: 35px;
max-width: 150px;
padding: 4%;
border: 1.5px solid rgba(0, 0, 0, 1);
}
.left li {
max-width: 150px;
}
.right li {
max-height: 75px;
max-width: 200px;
}
.left li:hover {
background: white;
}
.left li:hover a {
color: #663300;
}
.center {
width: 70%;
}
.footer {
background-color: #663300;
color: white;
text-align: center;
font-size: 20px;
padding: 20px;
}
.floatLeft {
float: left;
}
.textCenter {
text-align: center;
}
a {
color: white;
text-decoration: none;
}
img {
width: 90%;
margin: 15px;
border: 1px solid black;
height: 300px;
}
</style>
</head>
<body>
<!-- POCZĄTEK | KONTENER STRONY | CAŁA STRONA -->
<div class="container textCenter">
<!-- POCZĄTEK | LOGO | GORNA CZĘŚĆ STRONY -->
<div class="logo">
<a href="QWERTY" target="_blank" class="logolink"></a>
</div>
<!-- KONIEC | LOGO | GORNA CZĘŚĆ STRONY -->
<!-- POCZĄTEK | NAGŁÓWEK | GORNA CZĘŚĆ STRONY -->
<div class="header">
<a href="index.php">QWERTY</a>
</div>
<!-- KONIEC | NAGŁÓWEK | GÓRNA CZĘŚĆ STRONY -->
<!-- POCZĄTEK | MENU | LEWA CZĘŚĆ STRONY -->
<div class="left floatLeft">
<ul>
<li><a href="index.php">QWERTY</a></li>
<li><a href="index.php">QWERTY</a></li>
<li><a href="index.php">QWERTY</a></li>
<li><a href="index.php">QWERTY</a></li>
<li><a href="index.php">QWERTY</a></li>
<li><a href="index.php">QWERTY</a></li>
<li><a href="index.php">QWERTY</a></li>
<li><a href="index.php">QWERTY</a></li>
<li><a href="index.php">QWERTY</a></li>
</ul>
</div>
<!-- KONIEC | MENU | LEWA CZĘŚĆ STRONY -->
<!-- POCZĄTEK | STRONA GŁÓWNA | ŚRODKOWA CZĘŚĆ STRONY -->
<div class="center floatLeft">
<p>QWERTY</p>
<p>QWERTY</p>
<p>QWERTY</p>
<img src="" />
</div>
<!-- KONIEC | STRONA GŁÓWNA | ŚRODKOWA CZĘŚĆ STRONY -->
<!-- POCZĄTEK | STATYSTYKI | PRAWA STRONA STRONY -->
<div class="right floatLeft">
<ul>
<li>Zegar</li>
<li>12:00:00</li>
<li>Licznik odwiedzin</li>
<li>Dzisiaj: </li>
<li>Wczoraj: </li>
<li>Razem: </li>
</ul>
</div>
<!-- KONIEC | STATYSTYKI | PRAWA STRONA STRONY -->
<div style="clear: both;"></div>
<!-- POCZĄTEK | STOPKA | DOLNA CZĘŚĆ STRONY -->
<div class="footer">
<a href="QWERTY" target="_blank">QWERTY</a>
</div>
<!-- KONIEC | STOPKA | DOLNA CZĘŚĆ STRONY -->
</div>
<!-- KONIEC | CAŁY KONTENER STRONY | CAŁA STRONA -->
</body>
</html>
