边框在Google Chrome上显示锚点的文本颜色

Question

在Google Chrome上，如果我在锚点中有div，则随机边框将更改为文本颜色。如果我检查元素，颜色会立即切换回正确的颜色。有没有办法解决这个错误？

这是html :(每次都不会发生，自然会出现错误的颜色）

<a href="/about"><div class="navc">
    <div class="navt"><?php echo $lang['0']; ?></div>
</div>
</a>

这是css：

#nav
{
float:left;
width:100%;
height:30px;
background:url('../images/nav.png') repeat-x;
border:1px solid #C2C1C1;
text-shadow:0 1px 0 white
}

#nav a
{
color:black;
text-decoration:none
}

.navc
{
padding:0 10px;
border-left:1px solid #C2C1C1;
border-right:1px solid #EEE;
float:left;
height:100%
}

.navt
{
padding-top:6px
}

如下图所示，“关于”导航按钮的边框错误

Answer 1

我只花了3个小时来解决这个错误（在这样的日子里，我觉得Webkit和Trident一样糟糕）......但是这里的答案是：

只有在锚(<a>)内部具有已访问过的“href”值的内联元素时才会发生这种情况。如：

<a href="http://www.google.com"><span>Button</span></a>

要解决此问题，我添加了以下CSS：

a {color: blue}

a span,
a:visited span /* Webkit will render a blue border unless this is explicitly specified */
{
    border: 1px solid red;
}

Answer 2

我找到了解决方案，

如果我使用span代替div，则问题似乎不会发生。

编辑 - 它发生了一次，因为它是一个跨度，刷新并且从那时起就没有发生过。

Answer 3

我刚刚用这样的标记遇到了这个：

<a href="http://www.google.com" class="outer-link">
    <img src="http://google.com/gif.png" />
</a>

我的风格看起来像这样：

img { border: 2px solid gray; }

灰色边框变成蓝色链接颜色，这是我修复它的方式：

.outer-link { color: gray; }

因此，即使img获得了错误的边框，它也会默认为我指定的灰色边框颜色。我知道它有点hacky但它​​确实有效。