chrome css问题:链接周围没有显示边框(右)

时间:2011-05-18 01:50:25

标签: css google-chrome webkit

我有这个小测试用例:http://jsfiddle.net/sV8js/

你可以在Chrome中看到(在win7 11.0.696.68上测试)前2个链接右边框是“切断”并且未显示。 FF和IE 7/8/9似乎表明没问题。

Browsershots:http://browsershots.org/http://top3skills.com/1.html

Safari上还有“buggy”(所以它与webkit有关吗?)

任何人都知道这种方法有什么问题或如何解决这个问题? (或者我应该向chrome报告错误)任何不影响其他浏览器的解决方法?

另外,我的测试用例与Right border not displaying on google chrome不同,但也许是同一个错误?

更新了:我不想使用inline-block,因为IE7不支持它,我发现这个bug,因为我正在删除我以前在那里的内联块: )这也是动态的,因此在每个链接后添加
都不容易,因为有些链接可能会突破到新的行,其他链接不会...所以我首先尝试获得“正确的方法”然后采取更“棘手”的方式。

3 个答案:

答案 0 :(得分:2)

您已将 DIV 设置为固定宽度 250px 。这是切断边缘。另外,您应该将display:inline-block;添加到 CSS 链接类中。这将使您的链接成为元素,同时保持内嵌。它还将应用您已正确设置的填充。

请在此处查看更新链接 http://jsfiddle.net/sV8js/12/

答案 1 :(得分:1)

尝试为这些链接提供display: inline-blockdisplay: block属性,因为链接是inline元素。

答案 2 :(得分:0)

您需要将display: block添加到.referencesSkills