css - 换行适用于除 IE 以外的所有浏览器

Question

我在页面上有一个小部件，它为源调用另一个脚本。像这样：

<!-- Beginning of widget code. -->
<div id="xyz_widget" ></div>
<script id="bootstrap" type="text/javascript" src="<some location>/bootstrap.js?" charset="utf-8">
</script>

在 bootstrap.js 中存在这个 iframe 代码：

<iframe style='background:transparent;overflow:hidden;border:0px;height:100%;width:100%' 
frameborder='0' border='0' marginwidth='0' marginheight='0' "width='100%' height='100%' 
allowTransparency='true'
src='"+buildBaseUrl (pUri)+"/widget/widget.jsp?"+pUri.query+"'>
</iframe>

我的问题是我无法在框架内包装长文本。所以 11111111111111111111111111111111111111111111 超出了框架宽度。我试过 word-wrap:break-word 但它没有帮助。

我还应该提到这个问题只存在于 IE 中。FF、Chrome、Safari 一切正常。

有什么帮助吗？

Answer 1

看看这个 css 属性-ms-word-wrap，在iframe加载的页面中放一个div这样的

<div style="word-wrap:break-word;width:100%;left:0">
    ... //content on the page
</div>

希望有帮助，

Answer 2

请试试：

.wrapWords {
    width: 300px;
    white-space:      pre-wrap; /* css-3 */
    white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
    white-space:     -pre-wrap; /* Opera 4-6 */
    white-space:   -o-pre-wrap; /* Opera 7 */

    word-wrap: break-word; /* Internet Explorer 5.5+ */
}