Firefox视图响应式布局不起作用

时间:2015-12-07 08:45:08

标签: responsive-design

我正在本地处理响应式布局。我正在使用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;

}
}

0 个答案:

没有答案