媒体查询保证金失败

Question

到目前为止，我的所有媒体查询都很好，除了这个。我有一个实际的 iPad，我正在使用模拟器，而且我的客户不喜欢他的徽标靠在屏幕边缘，所以我想做的就是给它一些填充或边距（填充也不起作用）。我想另一双眼睛不会受伤——我是不是漏掉了什么？？

@media screen only and (min-width:768px) and (max-width: 1024px) {
    .site-header .home-link {
        margin: 0 20px!important;
    }
}
.site-header .home-link {
    background: url(http://client.savorweb.com/INWS/wp-content/uploads/2015/04/iwns-logo.png) left no-repeat;
    color: #141412;
    display: block;
    margin: 0 auto;
    max-width: 1024px;
    min-height: 150px;
    padding: 0px 5px 0px 10px;
    text-decoration: none;
    width: 100%;
}

Answer 1

您的媒体查询格式不正确。应该是：

@media only screen and (min-width:768px) and (max-width: 1024px)

强调仅屏幕而不是仅屏幕。

媒体查询保证金失败

Media Query Margin Fail

css

media-queries

margin