问题标签 [css-hack]

我在 @media query 的帮助下开发了一个响应式页面。现在，当我在 iphone 6+ 上查看我的页面时，就会出现一些不需要的空白边距。

但页面在 chorme 、 firefox 浏览器（开发者模式）上运行良好。

是否有任何用于 safari 的 CSS hack，以便我可以从我的页面中删除不需要的空白页边距。

我在响应式 CSS 中使用了以下代码

我在下面的代码中尝试了这个，但它仍然可以在 Safari 和 Chrome 上运行。

请让我知道仅适用于 Safari 而不是 Chrome的黑客攻击

两者都在 Chrome 和 Safari 上工作，但我只希望在 Safari 上工作。

你好 SO 社区！

我知道这个问题有很多变体，但是似乎没有人像我一样尝试做一些非常重要的事情。我的场景不能轻易使用width: 100%. 所以让我们开始这个派对吧！

在准备好 Chris Coyier 关于从对象边界破解 CSS 三角形的文章后，我部分地得到了这个想法。

重要让我首先声明，我知道在大多数情况下，您会使用width:100%，但是，我正在使用边框，您不能使用带边框的百分比 :(

我也真的真的很想避免在这个解决方案中使用 javascript。请不要使用 javascript 解决方案来回答，因为我已经知道如何使用 javascript 来解决这个问题。我也不喜欢将 body max-width 设置为 100% 的想法。我不想限制这个项目的任何溢出约束。非常感谢你。:)

HTML

CSS

现场演示

单击此处查看实时演示（我无法使用 codepen，因为我使用的是 vw 和 vh）

目标

1. 将&&元素.divider-blue-red扩展.divider-red-green到视图窗口的 100%，不包括滚动条
2. 不使用 javascript（纯 CSS 解决方案）
3. 未将正文设置为“最大宽度：100%”
4. 有一个很酷的流体设计，随着设备的宽度和高度滚动！:)

我正在使用 css 创建一个翻转卡片，当用户悬停/单击卡片时，它会翻转以显示背面的内容。这适用于除 IE9 之外的所有浏览器。

我正在尝试使用 css hack，但在用户将鼠标悬停在前面的 div 上之前，无法隐藏后面：

我相信 IE9 不支持 css 的 3d 透视功能，因此卡片很可能只能在悬停时显示/隐藏卡片的背面。

JSFIDDLE：https ://jsfiddle.net/uetno72t/4/

我想针对 Safari 6-9 版本并为此需要特定的 css。

我在 safari 7 和 8 下尝试了 css，但它也被应用于 Safari 9：

我尝试了 safari 9 的 2 个 hack，但上面的 9 覆盖了下面的

我也为 safari 尝试了以下方法，但它适用于 6 和 7，而不适用于 8

任何帮助都是不言而喻的。

我一直在解决这个问题

各位大佬是怎么解决这样的问题的？

我试图用 javscript 解决它，但我的解决方案看起来不对。

它使用 setInteval 检查是否有任何嵌套子级更改了它的高度，然后重新计算父框的高度。实际上，由于性能和代码美感，我需要找到更好的解决方案。

与实际重新计算相比，片段非常简化。

我可以随意使用 flexbox 或任何可以解决此问题的工具

我想将此“hack”添加到启用引导的页面（https://gist.github.com/Jakobud/c057577daddbde4dd709），但是我对引导完全陌生，我不确定在哪里添加代码. 我知道在 css 文件夹中我有 bootstrap.min.css 和 bootstrap.css 但是如果您单击上面的链接，您会看到它显示为“SASS”，并在第 15 行显示：//说明：将以下内容添加到bootstrap.scss 的结尾。

我只是使用标准的 Bootstrap，所以我不确定将代码放在哪里！

谢谢！

我网站的一部分在 IE 中看起来很糟糕，我只是在这里和其他网站（如 css trikes 或 github）搜索并尝试对 IE 使用 css hacks，但 css hacks 对我的问题不起作用。 这是我的网站

您可以在我截取的屏幕截图中看到箭头问题，如果您在 chrome 或 firefox 中打开网站，这部分效果很好，

这是我这部分的 CSS 代码

这是我这部分的 HTML 代码

谁能帮我解决这个问题？

I am working on a slide/push out menu and have another question (thanks for the help last time).

I have the menu sliding out and compressing the webpage, but the webpage on the server is a bit slow (complex page and calling python strings etc) and its causing a flash of the menu underneath to be shown before the page content loads. So I think I would want to hide the menu on page load, maybe until you click the trigger icon. I've tried a bunch of things and cant figure out how to do it. I'm sure its simple, and that I just don't fully understand the 'checkbox hack'. Any other suggestions are welcome though! I can't have javascript, only css.

Extra, but would be helpful: If anyone could help me implement that animated icon (under the home icon) instead of the home icon, it would be super helpful. I cant seem to figure it out.

Edit: I realized that what was causing the flash is transition: all 0.4s ease 0s; on .site-wrap. Because it is slower on my server, the transition is slowed down and you can see the underlying menu when the whole page transitions. Not sure if there is a way to do left and right transition combined, rather than all.

Edit: I cannot reproduce this issue on jsfiddle, just on my server when the python strings get called within the content.

I hope this all makes sense!

Here is my jsfiddle for reference: https://jsfiddle.net/2u64k0xq/6/

尝试为 Internet Explorer/Edge ≥ 10添加此浏览器选择器黑客

我@Styles.Render("~/content/myCssBundle")用来渲染我的 CSS。

但是，当我将上面的 hack 包含在我的一个 css 文件中时，我得到： 索引超出了数组的范围。

bundler似乎对这个css hack有问题，很奇怪！