0

我试图让我的侧边栏流畅,以便它随着浏览器窗口调整,一切似乎都很好,除了添加媒体查询后,我的 CSS 样式中断了,但是当我把查询拿走时,它是回到我的样式表中的规范样式。有人可以看看我的代码并告诉我我做错了什么吗?提前致谢!

顺便说一句,当我将第二个结尾大括号添加到#rightandoverview 媒体查询时,样式会恢复到应有的方式,但流动性不起作用。会是什么呢?

#righthandoverview {
position: absolute;
top: 91px;
right: 0px;
width: 20%;
height:215px;
background-color: white;
webkit-box-shadow: 0px 4px 5px -5px #777;
-moz-box-shadow: 0px 4px 5px -5px #777;
box-shadow: 0px 4px 5px -5px #777;
}

@media screen and (max-width:830px) and (min-width:100px) {
#righthandoverview {
    float: left;
    width: 30%;
    background-color: yellow;
    margin-top: 5px;

}





#righthandoverview ul {
position: absolute;
display: inline;
float: left;
font-family: klavika-light;
list-style-type: none;
text-decoration: none;
white-space: nowrap;
}

@media screen and (max-width:830px) and (min-width:100px) {
#righthandoverview ul {
    float:left;
    width:30%;
    background-color: yellow;
    margin-top: 10px;

}
}




#righthandoverview ul li > a {
display: inline;
text-decoration: none;
color:#8BAFDA;
}   

#righthandoverview ul li {
padding-bottom: 6px;
}
4

2 回答 2

0

你在下面的代码中错过了一个括号,我已经添加了它。

 @media screen and (max-width:830px) and (min-width:100px) {
        #righthandoverview {
            float: left;
            width: 30%;
            background-color: yellow;
            margin-top: 5px;

        }
    }
于 2012-09-26T04:03:43.090 回答
0

看起来您缺少一个括号来结束您的第一个媒体查询

@media screen and (max-width:830px) and (min-width:100px) {
#righthandoverview {
    float: left;
    width: 30%;
    background-color: yellow;
    margin-top: 5px;

}





#righthandoverview ul {
position: absolute;
display: inline;
float: left;
font-family: klavika-light;
list-style-type: none;
text-decoration: none;
white-space: nowrap;
}
}
于 2012-09-26T02:42:44.760 回答