IE边框半径使边框和背景曲线的角落不同

Question

我的<div>有background和border。

我定义border-radius: 10px 0 10px 0并且IE使边框在右上角和左下角变圆，而背景在其他角落变圆。

所以我有两个角落有一个方形边框，背景没有到达终点，两个有圆边框，背景突出。

我应该说当我添加direction: ltr时，它会修复它，但我需要direction: rtl。

如果我指定border-top-right: 10px等，那就是同样的事情。边界将在错误的角落进行。

Answer 1

黑客入侵是不是很重要？

#div1 {
    direction:rtl;
    border:1px solid black;
    background:green;
    border-radius:10px 0 10px 0;
    margin:20px auto;
    width:300px;
    padding:10px;
    -ms-transform: rotate(180deg);
}
:root #div1 {
    direction: ltr \9; /* IE9+ */
}
#div1 > span {
    direction: rtl;
    -ms-transform: rotate(180deg);
}

<span>中的环绕文字内容：

<div id="div1">
    <span>some text</span>
</div>