IE 在从右到左的语言中无法正确显示边框半径答案

【问题标题】：IE does not display border-radius correctly in right to left languagesIE 在从右到左的语言中无法正确显示边框半径
【发布时间】：2015-10-22 17:07:50
【问题描述】：

当使用从右到左的语言并在父级上进行填充时，IE 无法在某些元素上正确显示边框半径。边框最终被我假设的父级填充所抵消。设置获取背景的元素的display:inline-block; 似乎可以解决此问题，但它会导致我不想要的包装问题。这是一个在 Chrome 中工作的小提琴，但在 Firefox 中看起来很糟糕：http://jsfiddle.net/u3x0twzg/5/

HTML：

<div dir="rtl">
    <span class="wrapper">
        <span class="border">Here is some text</span>
    </span>
</div>`

CSS：

body {
    background-color:grey;
}

.wrapper {
    display:inline-block;
    padding: 0 10px 0 0;
}

.border {
    background-color:white;
    border-radius:5px;
}

【问题讨论】：

标签： html css internet-explorer right-to-left

【解决方案1】：

好的，我想我有一个适合你的解决方案。似乎这是IE中的一个错误。如果您让您的孩子跨入一个 p 标签，它将正确显示。像这样。

<div dir="rtl">
<span class="wrapper">
    <p class="border">Here is some text</p>
</span>

【讨论】：

段落是块元素。我需要它是一个内联元素。
我在网上浏览了一下，它是 IE 中的一个错误，我能找到的唯一方法是使用 p 标签。
很抱歉，但出于我的目的，它必须是一个内联元素。使用 p 标签不是一个可接受的答案，因为正如我所说，我知道我可以将其设为内联块（这更接近于一个好的解决方案），但我也不能这样做。