word-wrap:break-word 在 IE8 中无法按预期工作

发布于 2024-11-29 02:31:29 字数 2318 浏览 0 评论 0原文

我遵循 this

说有 word-wrap:break- word ,我们需要为表格元素设置“table-layout:fixed”。即使如此,它在 IE8 中也不起作用。我在这里缺少任何基础知识吗?

我附上 IE8 和 IE6 中的屏幕截图。以及 HTML 在 IE8 中是如何呈现的。 (IE8 中包含表格的面板有滚动条。)

IE6

IE8

IE8

从渲染的 HTML 中,我发现该表布局是固定的,样式也被应用。

但即便如此,IE8 也会以不同的方式显示网格。

<table cellspacing="0" rules="all" border="0" id="ctl00_memberContentPlaceHolder_empiMemberHcidGridView" style="border-width:0px;border-style:None;height:150px;width:750px;border-collapse:collapse;**table-layout: fixed**">
            <tr class="Row" align="center">
                <td align="left" style="width:155px;white-space:nowrap;">
                                        <span id="ctl00_memberContentPlaceHolder_empiMemberHcidGridView_ctl02_typeLabel">IT</span>
                                    </td><td align="left" style="width:155px;white-space:nowrap;">
                                        <span id="ctl00_memberContentPlaceHolder_empiMemberHcidGridView_ctl02_firstNameLabel">AAA</span>
                                    </td><td align="left" style="width:155px;white-space:nowrap;">
                                        <span id="ctl00_memberContentPlaceHolder_empiMemberHcidGridView_ctl02_lastNameLabel">BBB</span>
                                    </td><td align="left" style="width:155px;white-space:nowrap;">
                                        <span id="ctl00_memberContentPlaceHolder_empiMemberHcidGridView_ctl02_appReceivedDateLabel">3/01/2011</span>
                                    </td><td align="left" style="width:155px;white-space:nowrap;**WORD-BREAK:BREAK-ALL**">
                                        <span id="ctl00_memberContentPlaceHolder_empiMemberHcidGridView_ctl02_commentsLabel">TestingTestingTestingTestingTestingTestingTestingTestingTestingTestingTestingTesting</span>
                                    </td>
        </table>

有帮助吗?提前致谢

I followed this

which say that to have word-wrap:break-word , we need to have "table-layout: fixed" for the table element. Even then it is not working in IE8. Am I missing any fundamentals here ?

Iam attaching the screen shot of it in IE8 ans IE6 . And how the HTML is rendered in IE8.
(There is scroll bar for the panel enclosing the Table in IE8.)

IE6

IE8

IE8

From the HTML rendered , i fnd that Table Layout is Fixed and the style is also applied.

But even then IE8 displays the grid in a different manner .

<table cellspacing="0" rules="all" border="0" id="ctl00_memberContentPlaceHolder_empiMemberHcidGridView" style="border-width:0px;border-style:None;height:150px;width:750px;border-collapse:collapse;**table-layout: fixed**">
            <tr class="Row" align="center">
                <td align="left" style="width:155px;white-space:nowrap;">
                                        <span id="ctl00_memberContentPlaceHolder_empiMemberHcidGridView_ctl02_typeLabel">IT</span>
                                    </td><td align="left" style="width:155px;white-space:nowrap;">
                                        <span id="ctl00_memberContentPlaceHolder_empiMemberHcidGridView_ctl02_firstNameLabel">AAA</span>
                                    </td><td align="left" style="width:155px;white-space:nowrap;">
                                        <span id="ctl00_memberContentPlaceHolder_empiMemberHcidGridView_ctl02_lastNameLabel">BBB</span>
                                    </td><td align="left" style="width:155px;white-space:nowrap;">
                                        <span id="ctl00_memberContentPlaceHolder_empiMemberHcidGridView_ctl02_appReceivedDateLabel">3/01/2011</span>
                                    </td><td align="left" style="width:155px;white-space:nowrap;**WORD-BREAK:BREAK-ALL**">
                                        <span id="ctl00_memberContentPlaceHolder_empiMemberHcidGridView_ctl02_commentsLabel">TestingTestingTestingTestingTestingTestingTestingTestingTestingTestingTestingTesting</span>
                                    </td>
        </table>

Any Help ? Thanks in Advance

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

我为君王 2024-12-06 02:31:29

实际上,我不会担心您的示例中看到的这种人为文本的自动换行(没有空格)。

据说,解决方案之一可能是将内容包装在 div 内并应用宽度和宽度。 div 的自动换行。例如,请参阅此小提琴: http://jsfiddle.net/6Cm3U/1/

Practically speaking, I would not worry about word wrapping for such contrived text as sighted in your example (where there no white space).

Said that, one of the solution could be to wrap the content inside a div and apply width & word-wrap to the div. See this fiddle for example: http://jsfiddle.net/6Cm3U/1/

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文