如何修复包装文本上的圆角边框

我在我的应用程序（动态生成）中有一个包含3列的表格。文本太长的单元格会将其包裹起来，除非圆角边框现在看起来很糟糕。如何修复包装文本上的圆角边框

enter image description here

目前，我的表被包裹在一个DIV设置为项目列表的ID和CSS如下：

#item-list { 
    text-align: center; 
} 


#item-list table { 
margin: auto auto; 
} 

#item-list td { 
padding: 10px; 
text-align: center; 
} 

#item-list a { 
font-size: 0.8em; 
color: #FFF; 
margin: 10px; 
border-radius: 8px; 
-moz-border-radius: 8px; 
-webkit-border-radius: 8px; 
padding: 4px; 
padding-left: 10px; 
padding-right: 10px; 
background-color: #1a546a; 
text-decoration: none; 
font-weight: bold; 
} 

#item-list a:hover { 
background-color: #8f2525; 
}

我的问题是，是否有办法使用CSS来使包裹的文字仍然在所有边缘上圆润？

[免责声明]我的专长是PHP。 CSS是一种技能，我足够了解通常可以完成我需要做的事情，但不会超出业余爱好。

来源

2012-03-07 Jeremy Harris

将display: block;添加到您的#item-list a。

#item-list a { 
    font-size: 0.8em; 
    color: #FFF; 
    display: block; 
    margin: 10px; 
    border-radius: 8px; 
    -moz-border-radius: 8px; 
    -webkit-border-radius: 8px; 
    padding: 4px; 
    padding-left: 10px; 
    padding-right: 10px; 
    background-color: #1a546a; 
    text-decoration: none; 
    font-weight: bold; 
}

我已经建立了一个简单的例子给你 - http://jsfiddle.net/spacebeers/g5YcT/

显示区块

元素显示为块元素（如段落和头）。一个块元素在其上面和下面有一些空格，并且不能容忍它旁边的任何HTML元素。

来源

2012-03-07 14:08:02 SpaceBeers

辉煌。非常感谢！ – 2012-03-07 14:11:14

很酷。如果有帮助，请接受这个答案。 – SpaceBeers 2012-03-07 14:17:46

是的，我不得不等待。在接受答案之前有一个强制等待期。再次感谢。 – 2012-03-07 14:21:46

如何修复包装文本上的圆角边框

回答

相关问题