css - 媒体查询 margin 失败

标签 css media-queries margin

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

@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%;
}

最佳答案

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

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

强调仅屏幕而不是仅屏幕

关于css - 媒体查询 margin 失败,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30358682/

相关文章:

javascript - ios PWA 如何在移动默认 safari 上打开外部链接(不在应用浏览器中)

javascript - 隐藏当前未被选中的菜单

html - 媒体查询 div 不改变宽度,但其他一切正常

css - 修复没有星号 hack 的下拉菜单 CSS 样式

php - 几秒钟后突出显示不同的链接

css - 加载外部 css 文件但未应用

css - 媒体查询不执行

css - iPad Pro 12.9 媒体查询不起作用

html - 上边距显示为 18px 但未在 css 中设置

android - 如何在 Android 中删除 ActionBar 中的左填充边距额外空间?