ÿþ<!DOCTYPE html> <html> <head> <style> body {background-color: lightgrey;} {margin:0;} h1{ text-align: center; color: black; font: Arial; font-size: 80px; margin: 50px; } h2{ text-align: center; color: black; font: Arial; font-size: 40px; margin: 120px; } ul.topnav { list-style-type: none; margin: 0; padding: 0; overflow: hidden; background-color: #333; } ul.topnav li {float: left;} ul.topnav li a { display: inline-block; color: #f2f2f2; text-align: center; padding: 14px 16px; text-decoration: none; transition: 0.3s; font-size: 17px; } ul.topnav li a:hover {background-color: #555;} ul.topnav li.icon {display: none;} @media screen and (max-width:680px) { ul.topnav li:not(:first-child) {display: none;} ul.topnav li.icon { float: right; display: inline-block; } } @media screen and (max-width:680px) { ul.topnav.responsive {position: relative;} ul.topnav.responsive li.icon { position: absolute; right: 0; top: 0; } ul.topnav.responsive li { float: none; display: inline; } ul.topnav.responsive li a { display: block; text-align: left; } } .kontener{ position: relative; width: 1100px; height: 1000px; margin: auto; padding: 0px; border: 5px solid grey; } .kontener2{ width: 1100px; height: 150px; margin: 50px auto; border: 1px solid grey; background-color: maroon; } .kontener3{ background-image:url("http://bi.gazeta.pl/im/02/6e/10/z17229314IH,Dennis.jpg" ); Background-repeat: no-repeat; height: 427px; width: 500px; margin: 200px auto auto; border: 1px solid grey; } } .active{background-color: maroon;} </style> </head> <body> <div class="kontener"> <div class="kontener2"> <h1> Jamniki </h1> <ul class="topnav" id="myTopnav"> <li><a href="index.html">Strona GBowna</a></li> <li><a class="active" href="zdjecia.html">Zdjcia</a></li> <li><a href="ojamnikach.html">O Jamnikach</a></li> <li><a href="zaadoptuj.html">Zaadoptuj Jamnika</a></li> <li class="icon"> <a href="javascript:void(0);" style="font-size:15px;" onclick="myFunction()">?</a> </li> </ul> </div> <h2> Strona po[wicona najlepszym psom na [wiecie! </h2> <div class="kontener3"> </div> </div> <script> function myFunction() { var x = document.getElementById("myTopnav"); if (x.className === "topnav") { x.className += " responsive"; } else { x.className = "topnav"; } } </script> </body> </html>