簡體   English   中英

媒體查詢的一部分無法正常工作?

[英]Part of a Media Query not working?

我目前正在努力使商店響應,並且遇到以下問題。

我正在使用媒體查詢來設計商店的樣式,並且媒體查詢中的特定范圍不會完全適用

它可以在其余媒體查詢中完美運行,但是在這一特定查詢中,它不會做任何更改。

這是我的一個WORKING媒體查詢示例:

@media all and (max-width: 685px) and (min-width: 640px)
{
    #ShopMiddleHolderEShop {float:left; width:915px;}
    #rightSideHolder {padding-left:15px; width:37%; float:left; padding-bottom:8px;margin-right:50px;}
    .prodTable {float:left; width:105%}
    #prodListView {float:left; width:240px;}
    .prodTable td {width:130%; float:left;}
    .prodTmbHld {width:80%; margin:8px 0 0 0;/* display: list-item; *//* float: left; */}
    fieldset.prodTmb {/* float:left; */ margin:0 auto;padding:5px 0;width:99.5%; height:150px;}
    .prodTmbImg { width:145px; height:143px; float:right;}
    .prodTmbImg img { width:140px; height:140px; float:left}
    .prodDsc { padding-left:10px; float:left; width:145px; font-size:12px; line-height:14px}
}

這是行不通的范圍!

@media all and (max-width: 640px) and (min-width: 590px)
{
    #ShopMiddleHolderEShop {float:left; width:915px;}
    #rightSideHolder {padding-left:15px; width:37%; float:left; padding-bottom:8px;margin-right:50px;}
    .prodTable {float:left; width:105%}
    #prodListView {float:left; width:auto; margin-right:320px;}
    .prodTable td {width:130%; float:left;}
    .prodTmbHld {width:70%; margin:8px 0 0 0;/* display: list-item; *//* float: left; */}
    fieldset.prodTmb {/* float:left; */ margin:0 auto;padding:5px 0;width:99.5%; height:150px;}
    .prodTmbImg { width:145px; height:143px; float:right;}
    .prodTmbImg img { width:140px; height:140px; float:left}
    .prodDsc { padding-left:10px; float:left; width:145px; font-size:12px; line-height:14px}
    #viewNav { float:left; width: 170px; border-right:1px solid #8FBCD1}
    #viewNav span { float:left; padding-left:8px}
    #viewNav a {float:left; border-right:1px solid #8FBCD1; padding:0 8px}
    #ShopUnderHeaderHolder { float:left; width:10%; background:#a8a8a8}                         
}

任何幫助將不勝感激! 謝謝!

問題是我有重疊的CSS。

我不小心將相同的媒體查詢復制並粘貼到我正在處理的媒體查詢上方,但尚未關閉。

例如:

@media all and (max-width:640px) and (min-width:590px)
{

/*Some code here*/

我刪除了這段代碼,它運行良好!

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM