html - CSS:在一定宽度以上并排排列的相等容器,在该宽度以下时彼此重叠

标签 html css

我有两个容器。

当屏幕为 500 像素或更小时,这些容器需要彼此叠放,并且都占据 100% 的屏幕。

当屏幕超过 500px 时,它们需要并排占据屏幕水平空间的相同宽度。

这需要在 ie8 中工作。我不能使用媒体查询。

仅使用 CSS 这可能吗? (没有 JavaScript)

最佳答案

这只有在支持媒体查询的浏览器中才有可能,但遗憾的是 IE8 不支持,尽管您可以获得一个 JS 插件(Respond.js 或类似的),这将使它们在 IE8 上工作。

This是支持媒体查询的浏览器中的工作版本

关键的一段代码是

@media 
  screen and (max-device-width: 500px), 
  screen and (max-width: 500px) {

可以看到支持媒体查询here

关于html - CSS:在一定宽度以上并排排列的相等容器,在该宽度以下时彼此重叠,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13009392/

相关文章:

javascript - 如何保存可拖动对象的位置

javascript - 带有纯 CSS 内容的具有初始自动高度的文本区域

javascript - 如何使用滚动条图像?

html - html属性中的vuejs变量

html - 如何在 ASP.NET 中生成 Word 文档(doc,docx)?

html - CSS 不匹配的宽度

html - IE : iFrame Showing, 和无边界*老板说*

css - Chrome 36 - webkit 动画错误(一切都消失了)

jquery - 如何在输入字母时向右移动一个 div(如输入插入符号)?

html - 我们可以用基本的 html 和 css 制作简单的条形图吗