我正在本地处理响应式布局。我正在使用firefox响应式布局工具进行测试。出于某种原因,Firefox没有为320px应用媒体查询。我尝试了这个解决方案Browser not recognizing max-device-width,但它没有用。 任何的想法?
我的代码
@media only screen and (max-width: 320px) {
.btn-default {
display: inline-block !important;
}
.slide figure figcaption {
right: 21%;
width: 67%;
}
aside {
width: 64%;
margin-top: 0%;
margin-right: 30%;
}
.footerFloat {
width: 25%;
float: left;
min-width: 200px;
margin-left: 118px;
}
.textul {
text-align: left;
}
h1 {
font-size: 20px;
text-align:left;
margin: -36px 0px 16px;
}
}
当我用320px分辨率的inspect元素调试我的代码时,它不会读取上面的代码。 Intsead去:
@media only screen and (max-width : 800px) {
.btn-default {
display: inline-block !important;
}
aside {
width: 64%;
margin-top: 0%;
margin-right: 30%;
}
header {
background-position: center;
background-image: url('Images/logo_mobile.png') ;
}
h1 {
font-size: 20px;
text-align:center;
margin: -136px 0px 16px;
}
.textul {
text-align: left;
}
}