1

我需要一些关于css 3问题的帮助......

问题是当我用 boder-radius 定义一个滚动框，然后滚动到底部时，边框存在裁剪问题。如果内容 div 是用静态位置定义的，没有问题，但我需要它是相对的，以获得翻译效果。

您可以尝试以下代码来了解我的意思：

<html>

<body>
    <div class="scrollBox" style="width:50%;height:100px;background:grey;border-radius:10px">
        <div class="content" style="height:100%;overflow:scroll">
            <div>Item</div>
            <div>Item</div>
            <div>Item</div>
            <div>Item</div>
            <div>Item</div>
            <div>Item</div>
            <div>Item</div>
            <div>Item</div>
            <div>Item</div>
            <div>Item</div>
            <div>Item</div>
            <div>Item</div>
            <div>Item</div>
            <div>Item</div>
            <div>Item</div>
            <div>Item</div>
            <div>Item</div>
        </div>

    </div>
</body>

</html>

希望实际上有解决我的问题的方法。谢谢 ！

4

2 回答 2

2

添加一点水平填充：.content { padding:0 10px;}

我认为border-radius只是将背景颜色的角变圆，它实际上并没有改变形状/剪辑块的角。

于 2012-10-27T17:11:31.270 回答
0

边框半径实际上会剪切内容，而不仅仅是背景颜色。您只需要overflow: hidden;容器块.scrollBox

于 2012-10-27T18:11:49.877 回答