Css 引导警报线在IE上中断

我有一个

警报

，在我的web应用程序顶部的固定位置显示错误消息：

<div class="alert-messages">
  <div class="alert alert-danger alert-dismissable" role="alert">
    <button type="button" class="close" title="Dimiss">
      <span aria-hidden="true">&times;</span>
    </button>
    <strong>A somewhat long error message that causes multiline in IE10</strong>
  </div>
</div>

问题是Internet Explorer总是把最后一句话分成一行，这在Chrome或Firefox上是不会发生的，我必须为这个项目支持IE10+

这就是Chrome和Firefox的外观：

这就是IE10上的情况：

---

以下是plunkr中的MVCE版本：您甚至可以尝试使用较短的消息，但仍然可以复制此消息。

您尝试过设置宽度吗？我认为这是一个选项，但如果

警报的宽度大于其中文本的宽度，它留下了一个与其他元素重叠的空白红色空间。可能是
空白：nowrap
？我只是使用您建议的链接在IE中设置了警报的宽度，它确实有效，如果您将其设置为475px，它会为您提供在线文本的宽度。但我明白你的意思。您可以查看设置
最小宽度
和
最大宽度
是否有帮助？@JosephMarikle是的！成功了！请随意将其作为答案发布，这样它可能会帮助将来遇到此问题的任何其他人。
.alert-messages {
 position: fixed;
 right: 24px;
 top: 21px;
}