文本未包装在宽度在IE7内的div中

时间:2012-07-03 20:15:35

标签: html css internet-explorer-7

在IE7中,宽度比文本窄的div中的文本不会换行到两行。它比IE7更适用于其他浏览器。

<div class="office-header-info">
<div class="local-office">District of Columbia</div>
</div>
.office-header-info {
  float: left;
}

.local-office {
  color: #893f22;
  width: 165px;
  text-align: center;
  font-size: 22px;
  font-weight: bold;
  margin-top: 17px;
  white-space: normal;
  line-height: 1.1;
}

在IE7中,哥伦比亚特区在其他浏览器中停留在一行

  

哥伦比亚特区

它应该是什么,所以IE7与哥伦比亚特区这样的一条线路不正确。如果我添加溢出:隐藏它会被切断。

有关此问题的任何内容解释了为什么文本不会包装到IE7中的两行?

1 个答案:

答案 0 :(得分:0)

white-space: pre; /* CSS 2.0 */
white-space: pre-wrap; /* CSS 2.1 */
white-space: pre-line; /* CSS 3.0 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
white-space: -moz-pre-wrap; /* Mozilla */
white-space: -hp-pre-wrap; /* HP Printers */
word-wrap: break-word; /* IE 5+ */

放手一搏。