Html 我很难使我的网站响应。我需要它来适应任何和所有的屏幕

下面是我正在使用的CSS和HTML。我已经在@media only screen上试过了。它不起作用，所以我去掉了那部分代码

我会在下面复制并粘贴我的html和css。你在下面看到的代码基本上是我到目前为止所拥有的全部代码

再次，我需要一种方法，使网页适合所有屏幕，而不改变他们原来的位置和布局

HTML-

将您的.box更改为

   .box {
      margin-right: 5%;
      text-align: center;
     }

这对我有用。然而，我没有使用任何图像，所以希望你不会干扰。当试图创建一个响应性强的网站时，使用绝对位置通常是一个坏主意

    body {
     top: 0;
     bottom: 0;
     left: 0;
     right: 0;
     margin: 0;
     height: 100%;
     width: 100%;
     font-family: Lato, sans-serif;
     font color: black;
     font-weight: 400;
     background-color: #C1E5E5;
       }

    h1 {
        padding-left: 50px; 
       }

    h3 {
        text-align: center;
        font-size: 500%;
        font-style: normal;
        font-weight: 400;
        }

   .invisible {
        margin:auto;
        border-radius: 15px;
        background-color: whitesmoke;
        padding: 30px; 
        width: 60%;
        height: 500px; 
       }

   .first {
       height: 150px;
       width: 90%;
       float: left;
       text-align: center; 
       background-color: whitesmoke;
       }

   .second {
       height: 150px;
       width:90%;
       float: left;
       text-align: center; 
       background-color: whitesmoke;
       }

   .third {
       height: 150px;
       width:90%;
       float: left;
       text-align: center; 
       background-color: whitesmoke;
      }

   .fourth {
       height: 50px;
       width: 90%;
       float: left;
       text-align: center; 
       background-color: whitesmoke;
      }

   .center {
      display: block;
      margin-left: auto;
      margin-right: auto;
      width: 40%;
      border-radius: 8px;
     }
   .box {
      position: absolute;
      padding-left: 265px;
      padding-right: 50px;
      text-align: center;
     }

   .box select {
       background: blue;
       color: white;
       padding: 10px;
       width: 250px;
       height: 50px;
       border: none;
       font-size: 20px;
       box-shadow: 0 5px 25px rgba(0,0,0,.5);
       -webkit appearance: button;
       outline: none;   
     }

   .box {
      margin-right: 5%;
      text-align: center;
     }