CSS Triangle 使用 :after 伪元素在 IE8 中显示为矩形答案

【问题标题】：CSS Triangle using :after psuedo element displaying as a rectangle instead in IE8CSS Triangle 使用 :after 伪元素在 IE8 中显示为矩形
【发布时间】：2013-09-10 22:48:57
【问题描述】：

我有一个三角形是：在表单中的每个表格元素之后（不要跟我谈论标记..我只能访问 CSS >.>）和 IE9/IE10/Chrome/FF 它工作正常。但是，当我在 IE8 中检查它时，我得到的是一个实心矩形而不是三角形。

这是css：

.wSectionTableCSS:after {
content: "";
bottom: -38px;
left: 17px;
border-style: solid;
border-width: 25px 0 0 20px;
border-color: rgba(77, 77, 77, 0.13) transparent;
width: 0;
z-index: 1;
    margin: 0 0 0 -20px !important;
    position: relative;
overflow: visible;
display: inherit;}

How it currently looks

What it should look like

您知道什么可能会影响三角形的形状（以及我们处理它时的透明度）吗？

【问题讨论】：

IE8 不支持 border-color 和 rgba。这可能会有所帮助，但没有承诺 => kimili.com/journal/…
我检查了，但我不确定如何将透明度过滤器应用于边框颜色（而不是背景）。

标签： css internet-explorer-8 geometry pseudo-element

【解决方案1】：

确保声明了 DocType，否则 IE8 将无法理解 :after 伪选择器。

如果您可以不使用 rgba alpha，以下是在 IE8 中工作的 CSS 三角形的一些示例：http://css-tricks.com/snippets/css/css-triangle/

【讨论】：

看起来这需要额外的层 - 不幸的是，我无权编辑 html。