CSS：最大宽度为无

（它适用于其他浏览器而不是镀铬）CSS：最大宽度为无

我想申请一个样式仅当浏览器尺寸小于1400px

与max-width不@media查询工作

@media only screen and (max-width:1400px) { 
.heading-left { 
    left: -0.5%; 
    } 
}

与min-width其工作

@media only screen and (min-width:480px) { 
.heading-left { 
    left: -0.5%; 
    } 
}

但LSO变造当浏览器宽度大于1400px（我知道那它是如何工作，但最大宽度不工作）

捣鼓这个

可能你有错误的顺序查询......但没有演示它很难提供帮助。 –

这是目前唯一的媒体查询 –

你能提供一个小提琴吗？ –

尝试此方法。

这将根据设备

@media screen 
and (max-device-width: 1400px) 
and (min-device-width: 480px) 
{ 
    .heading-left { 
    left: -0.5%; 
    } 

}

要基于浏览器的窗口区域

@media screen 
and (max-width: 1400px) 
and (min-width: 480px) 
{ 
    .heading-left { 
    left: -0.5%; 
    } 

}

2015-06-08 10:17:43 Prime

不工作。最大设备宽度将检查设备的宽度而不是窗口的权利？ –

@DivyaBarsode，是的，如果你想要定位显示浏览器，试试'max-width'。 – Prime

无法正常工作。不知何故，在开发人员工具甚至没有看到 –

这一目标的工作对我来说

@media screen and (max-width: 700px) and (min-width: 400px) { 
    .heading-left { left: -0.5%; } 
}

2015-06-08 10:30:03

nope不工作！ –

''和'后面我忘了空格。编辑 –

您是否尝试添加视口？

<meta name="viewport" content="width=device-width, initial-scale=1">

视口是用来渲染时响应的网页，并与移动网站打交道时，因此大多使用，但与媒体查询打交道时它可以帮助了解CSS的实际设备宽度是什么。

2015-06-08 12:41:26 Stewartside

没有这个标签，媒体查询只是MATCH而不管条件如何。例如max-width：x px总是返回true。 – Gishu

开发人员工具说，视口的大小是1400px，但实际宽度的CSS正在考虑超过1400px。因为这个媒体查询不起作用。

2017-07-08 09:06:25

回答