CSS和邊界半徑問題

我需要一些幫助與CSS 3的問題...CSS和邊界半徑問題

問題是，當我定義了一個滾動框與畦半徑，然後我滾動至底部，還有一個剪裁問題與邊界。如果內容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>

希望其實是有我的問題的解決方案。謝謝！

來源

2012-10-27 Aleks

你試過添加'padding'嗎？另外：你確定你不應該使用列表和列表項目（'li'）來顯示你想要顯示的內容嗎？ – PeeHaa

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

我覺得border-radius只是輪的背景顏色的角落，它實際上並沒有改變形狀/夾塊的角落。

來源

2012-10-27 17:11:31 bookcasey

邊框半徑實際上會剪裁內容，而不僅僅是背景顏色。所有你需要的是容器塊的overflow: hidden;.scrollBox

來源

2012-10-27 18:11:49 skobaljic

CSS和邊界半徑問題

回答

相關問題