【问题标题】:<A HREF> + <DIV> combo not working on Google Chrome<A HREF> + <DIV> 组合在 Google Chrome 上不起作用
【发布时间】:2012-12-18 00:23:04
【问题描述】:

我使用的是水平菜单,带有这个 html 代码:

<table class="tabellacontent">
    <tr>
        <a class="mesitab" href="link"><td><div class="tabmese">Gen</div></td></a>
        <a class="mesitab" href="link"><td><div class="tabmese">Feb</div></td></a>
        <a class="mesitab" href="link"><td><div class="tabmese">Mar</div></td></a>
        <a class="mesitab" href="link"><td><div class="tabmese">Apr</div></td></a>
        <a class="mesitab" href="link"><td><div class="tabmese">Mag</div></td></a>
        <a class="mesitab" href="link"><td><div class="tabmese">Giu</div></td></a>
        <a class="mesitab" href="link"><td><div class="tabmese">Lug</div></td></a>
        <a class="mesitab" href="link"><td><div class="tabmese">Ago</div></td></a>
        <a class="mesitab" href="link"><td><div class="tabmese">Set</div></td></a>
        <a class="mesitab" href="link"><td><div class="tabmese">Ott</div></td></a>
        <a class="mesitab" href="link"><td><div class="tabmese">Nov</div></td></a>
        <a class="mesitab" href="link"><td><div class="tabmese">Dic</div></td></a>
    </tr>
</table>

​ 使用以下 CSS:

.tabellacontent{
margin:auto;
position:relative;
width:95%;
text-align:center;
}
.mesitab{
text-decoration:none;
}
.tabmese{
color:rgb(0,56,130);
margin:auto;
position:relative;
border:2px solid #000;
border-color:rgb(82,115,154);
width:100%;
height:15px;
top:1px;
text-align:center;
vertical-align:middle;
background-color:silver;
font-size:12px;
}
.tabmese:hover{
color:white;
background-color:rgb(49,87,132);
cursor: hand;
}​

我的问题是这段代码可以在 IE (7/8) 上运行,但不能在 Google Chrome 上运行。

我该如何解决这个问题?

这里有jsFiddle的链接

【问题讨论】:

  • 在 chrome 中是什么样子的?它应该是什么样子的?
  • 这是无效的 HTML。你不能将&lt;td&gt; 包裹在&lt;a&gt; 中。
  • 那为什么它可以在 IE7/8 上运行?
  • 并且你不应该在&lt;tr&gt;内放置除&lt;td&gt;之外的其他标签
  • 因为 IE 并不完全以遵循标准而闻名。

标签: internet-explorer google-chrome html href


【解决方案1】:

我正在学习j-query mobile,我发现chrome的href有一些问题,项目不能在chrome的本地驱动器中运行,你必须上传到服务器。

【讨论】:

    【解决方案2】:

    首先tr 应该有它的唯一孩子td 你有一个错误的html。

    解决方案a 标签放在tddiv 标签中,然后将divpaddingmargin 设为0 然后做一个标签display:block覆盖整个td。

    【讨论】:

      猜你喜欢
      • 2015-04-21
      • 2017-10-01
      • 2012-02-24
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-06-25
      • 2012-01-29
      • 1970-01-01
      相关资源
      最近更新 更多