html - <a>标签使对齐方式偏离

根据我放置</a>标记的位置，方框看起来会有所不同。这就是现在的样子。

JSFiddle

<a href="#">  <div class="box">
  <header><h2>Responsive C3</h2></header>
  <div id="chartA">
  </div>
</div></a>

当第二个框并排对齐时，如何保持第一个框为可单击对象？如果没有<a></a>标记，则它们对齐得很好。

最佳答案

类box允许您的块float:left并排放置。
如果将class="box"应用于a标记而不是div标记，它将按预期工作。

<a href="#" class="box">
  <div>
    <header>
      <h2>Responsive C3</h2>
    </header>
    <div id="chartA">
    </div>
  </div>
</a>

这是一篇很好的文章，可以更多地了解float：https://css-tricks.com/all-about-floats/和另一篇有关display的内容：https://css-tricks.com/almanac/properties/d/display/

关于html - <a>标签使对齐方式偏离，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/42322440/