Question

我正在尝试使用IE 9做一些圆角:( - 这是我的示例代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title></title>
        <style>
            body{
                direction:rtl;
            }
            ul{
                list-style: none outside none;
                padding:0px;
            }
            li{
                display: inline-block;
                padding: 10px;
                border-radius: 20px 20px 20px 0px;
                border: 1px solid #777;
                background-color: #AAA;
            }
        </style>
    </head>
    <body>
        <ul id='some'>
            <li>test1</li>
            <li>test2</li>
        </ul>
    </body>
</html>

仅仅因为身体上的direction:rtl;，IE就失去了他的左手和左手。右手！
边框正确圆整＆amp;背景镜像下面的图像

IE is an absolute idiot and this picture is one prove on it in millions

似乎它认为RTL人的右手是他们的左手X-（
Firefox，Chrome，Safari，...没有问题并正确呈现;
有什么解决方案吗？

谢谢

Answer 1

编辑：使用下面的解决方案更新了答案

http://jsfiddle.net/hxSgH/

        body{
        direction:rtl;
        }

        ul{
            direction:ltr;
            list-style: none outside none;
            padding:0px;
        }

        li{
            direction:rtl;
            display: inline-block;
            padding: 10px;
            border-radius: 20px 20px 20px 0px;
            border: 1px solid #777;
            background-color: #FF0000;
        }

<body>
     <ul id='some'>
        <li>test1 میکنیم @</li>
        <li>test2 میکنیم @</li>
    </ul>
</body>

IE失去了他的腿;右侧RTL页面

1 个答案: