Question

我在这个网站上的响应式设计时间很艰难。不知道发生了什么，我的代码有点变成垃圾，这是一个改进的zurb基础网格，但客户端想要左导航。一旦设计由于某种原因掉到iphone上，顶部元素（徽标，菜单）的宽度有一些余量，填充或仅约80％宽度。见http://eseamedia.com/lm

@media only screen and (max-width: 767px) { 

.menu {
    background: none;
    padding: 0;
    margin: 0;
    height: auto;
    max-width: 100%;
    min-width: 100%;
    position: relative;
    display: table;
    float: none; }

.menu nav {
    height: auto;
    margin :0 auto 26px auto;
    width: 100% }

.menu ul li a {
    margin: 0 auto;
    width: 100%;
    display: block;
    text-align:center; }

.logo {
    background-position: center center;
    background-color: transparent;
    margin 0;
    height: 104px;
    width: 321px;
    padding: 0 }

.info {
    position:relative }

.headline{
    margin:0;
    position:relative;
    padding:0;}

.context, .wrap {
    margin:0;
    left:0;}
}

Answer 1

使用元标记

<meta name="viewport" content="width=device-width, maximum-scale=1.0" />

css 100％宽度的iphone

1 个答案: