div之间的标签具有有效的高度和宽度0 [重复]

Question

参见https://jsfiddle.net/x7znc405/1/的示例

如果我有类似的html

<div id="wrapper">
<a>
  <div id="content">
  Hello World
  </div>
</a>
</div>

css

#content {
  background-color: blue;
  width: 100%;
  height: 100%
}

a {
  width: auto;
  height: auto;
}

#wrapper {
  display: inline-block;
  height: 39px;
  width: 200px;
}

a 标记似乎没有任何有效的宽度或高度。我可以在浏览器中点击它，它工作正常。

我关心的原因是，这意味着我必须使用force:true 来说服赛普拉斯该标签是可见的并且可以被点击，这显然让我面临标签真正不可见的问题。

我有什么方法可以让a“增长”以填充父 div？

Answer 1

a 标签是内联元素，width 和 height 对内联元素无效。

因此，要添加宽度或高度，您可以根据需要将a标签的显示属性设置为inline-block或block。