Question

如何让我的链接具有与父标记相同的高度和宽度，其中父标记维度是可变的？

我找到了this question here，Gaurav Saxena在那里发了一篇最先发布的帖子 - 直到我为HTML5添加了DOCTYPE。如果我这样做，它就不再适用于Firefox 8（不过它继续在Chrome中运行）。

所以这是完整的例子：

<!DOCTYPE html>
<head>
<style type="text/css">
.std {width: 200px; border: solid 1px green; height: 100%}
.std a {display: inline-block; height:100%; width:100%;}
.std a:hover {background-color: yellow;}
</style>
<title></title>
</head>
<body>
<table>
  <tbody>
   <tr>
    <td class="std">
     <a href="http://www.google.com/">Cell 1<br>
     second line</a>
    </td>
   <td class="std">
    <a href="http://www.google.com/">Cell 2</a>
   </td>
   <td class="std">
    <a href="http://www.google.com/">Cell 3</a>
   </td>
   <td class="std">
    <a href="http://www.google.com/">Cell 4</a>
   </td>
  </tr>
 </tbody>
</table>
</body>

提前感谢您的帮助！

Answer 1

这不起作用，因为您的百分比高度没有高度。为了澄清，您在链接上有height: 100%;，它将依赖于父元素的（td）高度。这也是100%，然后依赖于其父级的高度，该高度未设置。因此，它没有宽度工作。解决这个问题的方法是在表格或tds上设置一个高度。

示例：http://jsfiddle.net/8rRtZ/1/

填写父标签的链接（td，div）

1 个答案: