右侧边框不显示在谷歌浏览器上

Question

右侧边框不显示在谷歌浏览器上

Pau*_*jan 5 css google-chrome

我有一个div包含a一些边框.看到:

http://webnumbr.com/all

它在FF和IE中运行良好,但为什么右侧不能在Chrome中渲染？它是无效的CSS吗？(如果重要的话,在chrome OSX中测试)

Answer 1

小智 8

测试用例:包括在给定URL的内容更改后,此问题仍然有意义:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" 
  "http://www.w3.org/TR/html4/strict.dtd">
<html><head><style type="text/css">
div {
  float: left;
  clear: left;
  margin: 3px;
}
span {
  border: 1px solid;
}
</style></head><body>

<!-- does not show right border -->
<div><span>With trailing space, no width </span></div> 

<!-- does show right border -->
<div><span>No trailing space, no width</span></div>
<div style="width: 40ex;"><span>With trailing space, has width </span></div>
<div style="width: 40ex;"><span>No trailing space, has width</span></div>

</body></html>

Run Code Online (Sandbox Code Playgroud)

使用WebKit 532.6在Google Chrome 4.0.266.0(官方版本33992)中验证.

Answer 2

zom*_*bat 6

我不能告诉你为什么会发生这种情况,但我认为我有一个适合你的方法.您有空间填充链接内容,显然Chrome不能很好地处理这个问题.

如果删除<a>标签内容周围的额外间距,问题就会消失(我在Chrome检查器工具中执行了此操作).所以,改变:

<a href="pclark-hacker-news-karma"> 4,481 </a>

Run Code Online (Sandbox Code Playgroud)

至:

<a href="pclark-hacker-news-karma">4,481</a>

Run Code Online (Sandbox Code Playgroud)

处理浮动时,Chrome必须以奇怪的方式处理空间(如果删除search_data类上的浮动属性,边框也会出现).

归档时间：	15 年，12 月前
查看次数：	8312 次
最近记录：	15 年，12 月前