欧美一区二区三区,国内熟女精品熟女A片视频小说,日本av网,小鲜肉男男GAY做受XXX网站

我的媒體查詢文本沒(méi)有響應(yīng)

CSS

我能得到一些幫助嗎？我的媒體查詢沒(méi)有正確響應(yīng)，我不知道出了什么問(wèn)題。我的主要問(wèn)題是搜索標(biāo)題，搜索輸入和搜索結(jié)果。我已經(jīng)嘗試調(diào)整屬性，但我似乎不能讓他們做出正確的反應(yīng)。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="description" content="some content">
    <title></title>
<style>



  *{
    margin: 0px;
    padding: 0px;
      }

  body{
    overflow-x: hidden;
   
  }
  

  /* Styles for the search bar container */
  .search-container {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-image: url('https://mgecustomprints.s3.amazonaws.com/Brown+Wood+Minimalist+Profile+LinkedIn+Banner+(3).png');
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
  height: 600px;
  margin: 0;
  padding: 0;
  margin-top: 0px;

}




  .search-title {
    font-size: 60px;
    margin-bottom: 20px;
    color: #7c36ff;
    font-family: Canva Sans,Noto Sans Variable,Noto Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;
    text-shadow: -2px -2px 0 WHITE, 2px -2px 0 WHITE, -2px 2px 0 WHITE, 2px 2px 0 WHITE;
  }

  /* Styles for the search bar */
  .search-bar {
    display: flex;
    align-items: center;
    background-color: #7c36ff;
    padding: 10px;
    border-radius: 5px;
  }

  .search-input {
    width: 600px;
    padding: 10px;
    font-size: 16px;
    border: none;
    border-radius: 5px;
    color:#7c36ff;
  }

  /* Styles for the search results dropdown */
  .search-results {
    position: absolute;
    top: 75%; /* Position the dropdown vertically in the middle */
    left: 50%; /* Position the dropdown horizontally in the middle */
    transform: translate(-50%, -50%); /* Center the dropdown */
    z-index: 999;
    display: none;
    background-color: #fff;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
    width: 635px; /* Adjust the width as needed */
    max-height: 200px; /* Adjust the height as needed */
    overflow-y: auto; /* Add vertical scrollbar if needed */
     }

  .search-results.show {
    display: block;
  }

  .search-result {
    padding: 5px 10px;
  }

  .search-result a {
    text-decoration: none;
    color: #000;
  }
 

.card-section {
  display: flex;
  justify-content: center;
  align-items: center;
  height: auto;
  margin-top: 20px;
}

.card-container {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 0px;
  
}

.card {
  flex: 1;
   width: 300px;
   height: 500px;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  overflow: hidden;
  display: flex;
  justify-content: center;
   align-items: center;
  /* Remove margin property */
  margin: 0 10px;
  background: #7C36FF;
}

.card img {
  width: auto;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  
}


/* Random dummy image URLs */
.card:nth-child(1) img {
  content: url("https://mgecustomprints.s3.amazonaws.com/apparel.png");
  WIDTH: 500PX;
}

.card:nth-child(2) img {
  content: url("https://mgecustomprints.s3.amazonaws.com/request.png");
  WIDTH: 500PX;

}
.card:nth-child(3) img {
  content: url("https://mgecustomprints.s3.amazonaws.com/PACKAGED.png");
  WIDTH: 500PX;

}

.card:nth-child(4) img {
  content: url("https://mgecustomprints.s3.amazonaws.com/3P0B8216MARRICO+3.jpg");
  WIDTH: 500PX;

}



.card h3 {
  font-size: 18px;
  margin-bottom: 2px;
  color:WHITE;
}

.card p {
  font-size: 14px;
  color: WHITE;
  justify-content: center;
  align-content: center;
  padding-bottom: 5px;
}
</style><style>
@media screen and (max-width: 768px) {
  /* Styles for screens with a maximum width of 768px */
  .search-container {
                height: 100vh;
            }

            .search-title {
                font-size: 30px;
                text-align: center;
                margin-bottom: 10px;
            }

            .search-bar {
                flex-direction: column;
                align-items: flex-start;
                padding: 0;
            }

            .search-input {
                width: 100%;
                max-width: 600px;
                margin-bottom: 10px;
            }

            .search-results {
                top: 100%;
                width: 100%;
                max-width: 600px;
                height: 200px;
                overflow-y: auto;
            }

  .card-section {
    flex-direction: column;
    align-items: stretch;
  }

  .card {
    width: 100%;
    margin: 10px 0;
  }

  .card img {
    height: 200px;
    object-fit: cover;
  }
}

</style>

我調(diào)整了價(jià)值觀

# # #很抱歉，如果這似乎是一個(gè)顯而易見(jiàn)的事情，你已經(jīng)嘗試過(guò)，但你有沒(méi)有嘗試添加！重要；你的媒體查詢規(guī)則到底只是為了排除一些東西？假設(shè)您的問(wèn)題是768px下的規(guī)則根本沒(méi)有顯示在檢查器中，或者只是規(guī)則過(guò)多？