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>