CSS媒体查询未在指定宽度处激活。为什么不行？
CSS媒体查询未在指定宽度处激活。为什么不行？
提问于 2014-07-09 14:15:41
我有一个横跨页面(100%宽度)的栏，其中有一个子容器，它跨越了父容器宽度的80%。
我有以下CSS媒体查询，它应该将子容器的宽度从80%增加到100%：
@media screen and (max-width: 900px), screen and (max-device-width: 900px){
#imagebar .container{
width: 100%;
}
}然而，使用我的chrome开发工具给我的尺寸，查询以990px的宽度生效。不是900px。这发生在我的所有媒体查询中；它们都比正常情况下提前激活了80-100px。有人知道这可能是什么原因吗？
回答 2
Stack Overflow用户
发布于 2014-07-09 14:19:35
这是错误的格式。
@media screen and (max-width: 900px), screen and (max-device-width: 900px){
#imagebar{
.container{
width: 100%;
}
}
}应该是：
@media screen and (max-width: 900px), screen and (max-device-width: 900px){
#imagebar .container{
width: 100%; }如果要调用另一个元素中的元素，请不要同时打开两个元素，只需指定要编辑或更改的父元素。
Stack Overflow用户
发布于 2014-07-09 14:33:09
你可以这样试一下，它对你很管用。
/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
your css here
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/24646541
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号