1

我正在尝试使用 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失去了他的左手和右手！
边框正确四舍五入，背景镜像如下图

IE 是一个绝对的白痴，这张照片是数百万的证明

似乎认为 RTL 人的右手是他们的左手 X-(
Firefox, Chrome, Safari , ... 没有问题并正确渲染；
有什么解决方案吗？

谢谢

4

1 回答 1

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>
于 2013-03-02T00:53:00.983 回答