媒体css3不在safari浏览器上工作
媒体css3不在safari浏览器上工作
提问于 2013-09-30 15:19:42
我正在为浏览器调整大小或小型设备上显示的3>>2>>1列自定义引导程序。我使用了css3媒体查询，除了Safari之外，它在所有浏览器上都能使用。下面是我使用过的css。它总是使用第一个媒体查询，因此在Safari上引起了问题。我已经测试了Mac和Window Safari，并面临着同样的问题。请帮帮忙。
视图端口添加到head部分中
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1" />使用的CSS3：
/*Apply different margin based on media size*/
@media (min-width:1632)
{
.two-column .row-fluid [class*="span"]:nth-child(3n+1)
{
margin-left:100px;
}
}
@media (min-width: 981px) and (max-width: 1631px)
{
.two-column .row-fluid [class*="span"]:nth-child(2n+1)
{
margin-left:100px;
}
}
@media (min-width: 982px) and (max-width: 1155px)
{
.two-column .row-fluid [class*="span"]:nth-child(2n+1)
{
margin-left:10px;
}
}
@media (min-width: 545px) and (max-width: 981px)
{
.two-column .row-fluid .span6
{
margin-left:5%;
}
}
@media (max-width: 546px)
{
.two-column .row-fluid .span6
{
margin-left:5px;
}
}Stack Overflow用户
发布于 2014-02-23 13:15:00
看起来您在@media之后缺少“px”(最小宽度:1632)。
@media (min-width:1632px)这应该能解决问题。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/19097891
复制相关文章
相似问题
腾讯云开发者
