的情况下获得不同的宽度

【问题标题】：Html blocks get different widths with/without <br> insideHtml 块在有/没有 <br> 的情况下获得不同的宽度
【发布时间】：2013-12-11 18:05:49
【问题描述】：

包含文本的块元素的宽度取决于它们是否包含
标签。为什么？

<div>
  <span>Mmm mmm mmmmmm</span>
</div>

宽于

<div>
  <span>Mmm mmm<br>mmmmmm</span>
</div>

Chrome、Firefox、Opera、Safari、IE（在 Win7 操作系统上的最新版本）中的这种行为是相同的。

（当然，文本中断会因文本大小、侧边距和每行不同单词中的字符数而异。）

【问题讨论】：

标签： html css

【解决方案1】：

一个非常有趣的问题。我通过将 span-display 样式更改为 dispaly:block; “解决”了这个问题，因此两者都达到了 200px 的完整宽度。 see here

我认为这是因为“块”强制执行总块，但内联块将其绑定到文本流，因此跨度会根据其内容调整大小。

希望对您有所帮助。

【讨论】：