Question

我正在努力让商店做出回应，我遇到了以下问题。

我正在使用媒体查询来为商店设置样式，并且媒体查询中的特定范围不会是 AT ALL。

它在其他媒体查询中运行良好，但在这个特定的查询中它不做任何更改。

以下是我的 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}                         
}

任何帮助将不胜感激！谢谢！

Answer 1

问题是我有重叠的CSS。

我不小心将相同的媒体查询复制并粘贴到我正在处理的媒体查询之上但尚未关闭。

例如：

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

/*Some code here*/

我删除了这段代码，效果很好！

媒体查询的一部分不起作用？

1 个答案: