Я первый раз начал пытатся создавать сайт по макету, и вот кое что получается, я понимаю что много ошибок, но это первый раз! Я остановился, и не могу понять как сделать так чтобы при уменьшении страницы, всё уменьшалось равномерно, у меня когда уменьшаю страницу, просто видно пол страницы! <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="assets/css/style.css"> <title>Document</title> </head> <body> <header> <div class="photo"> <a href="assets/img/orig-3-10.jpg"></a> </header> <div class="item"> <section> <h1 class="p1"><b>BOOST UP YOUR LOCAL BUSINESS</b></h1> <h2 class="p2">Lorem lpsum is simple dummy text of the printing and typesettings industry. Lorem lpsum typesetting</h2> </section> <section> <form action=""> <label for="name"></label> <input required class="name" type="name" name="Full Name" placeholder="Full Name"> <label for="email"></label> <input required class="email" type="email" name="Email Address" placeholder="Email Address"> <label for="phone"></label> <input required class="phone" type="phone" name="phone" placeholder="Phone Number"> <button class="send"><b>REQUEST A QUOTE</b></button> </form> </section> </div> <section> <nav> <form action="index.html"> <button class="home"><b>HOME</b></button> </form> <form action="index.html"> <button class="service"><b>SERVICE</b></button> </form> <form action="index.html"> <button class="aboutus"><b>ABOUT US</b></button> </form> <form action="index.html"> <button class="pricingtable"><b>PRICING TABLE</b></button> </form> <form action="index.html"> <button class="howitwork"><b>HOW IT WORK</b></button> </form> <form action="index.html"> <button class="happyclients"><b>HAPPY CLIENTS</b></button> </form> <a href="tel:+380689965758"><b>CONTACT US</b></a> </form> </section> <section> <img src="assets/img/123123.png" alt=""> </section> </nav> <footer> <p class="p3"><b>OUR SERVICES</b></p> <p class="p4">Lorem ipsum is samply dummy Business industry.</p> </footer> </body> </html> .item { width: 1900px; height: 600px; background-color: rgb(45, 194, 214); margin-top: 140px; box-sizing: border-box; } p { margin: 0px; } .p1 { color: white; display: flex; justify-content: center; padding-top: 80px; font-size: 40px; } .p2 { color: white; font-size: 20px; display: flex; justify-content: center; padding-bottom: 350px; } .p3 { color: black; font-size: 25px; position: absolute; margin-left: 835px; margin-top: 40px; } .p4 { color: black; position: absolute; margin-left: 785px; margin-top: 70px; font-size: 16 px; } .name { border: solid 1px white; width: 293px; height: 43px; position: absolute; bottom: 550px; left: 360px; } .email { border: solid 1px white; width: 293px; height: 43px; position: absolute; bottom: 296px; left: 662px; position: relative; display: block; } .phone { border: solid 1px white; width: 293px; height: 43px; position: absolute; bottom: 550px; left: 980px; } .send { color: white; background-color: orange; border: solid 1px orange; width: 235px; height: 47px; position: absolute; bottom: 550px; left: 1290px; } .home { color: white; background-color: orange; border: solid 1px orange; width: 75px; height: 32px; position: absolute; bottom: 886px; left: 700px; } .service { color: gray; background-color: white; border: solid 1px white; width: 75px; height: 32px; position: absolute; bottom: 886px; left: 795px; } .aboutus { color: gray; background-color: white; border: solid 1px white; width: 90px; height: 32px; position: absolute; bottom: 886px; left: 885px; } .pricingtable { color: gray; background-color: white; border: solid 1px white; width: 115px; height: 32px; position: absolute; bottom: 886px; left: 990px; } .howitwork { color: gray; background-color: white; border: solid 1px white; width: 115px; height: 32px; position: absolute; bottom: 886px; left: 1120px; } .happyclients { color: gray; background-color: white; border: solid 1px white; width: 125px; height: 32px; position: absolute; bottom: 886px; left: 1250px; } a { text-decoration: none; color: gray; background-color: white; border: solid 1px white; width: 150px; height: 32px; position: relative; bottom: 710px; left: 1389px; text-decoration: none; } img { height: 69px; position: relative; bottom: 748px; left: 320px; background-image: white;