Html iphone媒体查询在magento中不起作用？

我正在使用iphone5s的媒体查询。但它在移动设备中不起作用。网站的视图保持不变。我正在使用媒体查询，你可以在那里和你的iphone设备中查看

    @media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : portrait) {
    .wrapper {
    min-width: auto;
    width: 100% ;
    float: left ;
    }
    .nav-container {
    background: url(../images/nav.png) no-repeat;
    height: auto;
    width: 100%;
    }
    .page{
    width: 92%;
    float:left;
    overflow:hidden;
    }
    .header,.header-container{
    width: 100% ;
    float:left ;
    }
   .header .logo {
    margin: 3% auto 0;
    width:100%;
    }
   .header .logo img {
    display: block;
    margin: 0 auto;
    width: 70%;
    }
    .quick-access {
    float: left;
    height: auto;
    padding: 2% 1%;
    width: 98%;
    }
    .header .welcome-msg {
    float: left;
    padding: 0 ;
    text-align: center;
    width: 100%;
    }
    .header .links {
    margin: 0 auto;
    padding: 4% 1%;
    width: 94%;
    }
    .header .links li {
    background: hsla(0, 0%, 0%, 0) url("../images/tsp.gif") no-repeat scroll 100% 8px;
    float: left;
    margin: 0 3% 0 0;
    padding: 2% 3% 2% 0;
    }
    .main-container {
    float: left;
    margin-top: 15%;
    padding: 5% 4%;
    width: 92%;
    }
    .main {
    float: left;
    width: 100%;
    }
    .col3-layout .col-wrapper {
    float: left;
    margin: 0;
    width: 99%;
    }
    }

在我的浏览器中

---

在iphone5s中，由于存在一个div，该div具有类包装器的最大宽度，因此页面不适合移动屏幕，而是以像素为单位。我已将此更改为百分比，所有操作都开始正常运行。

您需要发布导致问题的代码。我不知道问题的原因是什么。媒体查询正在工作，但视图保持不变。看起来宽度有问题。但我无法解决这个问题，请向我们展示您的媒体查询。在这里在你的问题范围之内。您不能期望我们搜索您的源代码并猜测您正在谈论的是哪段代码。这是我的代码块。