空白:nowrap在IE 9中不起作用 [英] white-space: nowrap not working in IE 9

查看:136
本文介绍了空白:nowrap在IE 9中不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一张白色空间设置为nowrap的表格,并且使用固定的表格布局来限制列宽。这正确地隐藏了Firefox中的长行,但在IE9中这些行正在打包。



测试用例:

 < table border =1width = 200 style =white-space:nowrap; table-layout:fixed;> 
< tr>
< td style =overflow:hidden; width = 150> Word中有一些空格不能在IE中工作< / td>
< td width = 50> 100/50< / td>
< / tr>
< tr>
< td style =overflow:hidden;宽度= 150> LoooooooooOOOOOOOOOoooooooooooooooooongword< / TD>
< td width = 50> 550/50< / td>
< / tr>
< tr>
< td style =overflow:hidden;宽度= 150> AnotherLoooooooooooonnnnnnnnnnnnnnnnGWord< / TD>
< td width = 50> 660/50< / td>
< / tr>
< / table>

Firefox:



IE 9:
doctype

使用严格的 / strong>它在我的IE9中工作,我的结果与Firefox中相同。我已经测试了代码

 <!DOCTYPE HTML PUBLIC -  // W3C // DTD HTML 4.01 // EN http://www.w3.org/TR/html4/strict.dtd\"> 
< html>
< head>
< / head>
< body>
< form>
< table border =1width = 200 style =white-space:nowrap; table-layout:fixed;>
< tr>
< td style =overflow:hidden; width = 150> Word中有一些空格不能在IE中工作< / td>
< td width = 50> 100/50< / td>
< / tr>
< tr>
< td style =overflow:hidden;宽度= 150> LoooooooooOOOOOOOOOoooooooooooooooooongword< / TD>
< td width = 50> 550/50< / td>
< / tr>
< tr>
< td style =overflow:hidden;宽度= 150> AnotherLoooooooooooonnnnnnnnnnnnnnnnGWord< / TD>
< td width = 50> 660/50< / td>
< / tr>
< / table>
< / form>
< / body>
< / html>


I have a table with white-space set to nowrap and columns widths restricted using table-layout fixed. This correctly hides long lines in Firefox, but in IE9 the lines are wrapping.

Test case:

<table border="1" width=200 style="white-space: nowrap; table-layout: fixed;">
    <tr>
        <td style="overflow: hidden;" width=150>Word with some spaces that isnt working in IE</td>
        <td width=50>100/50</td>
    </tr>
    <tr>
        <td style="overflow: hidden;" width=150>LoooooooooOOOOOOOOOoooooooooooooooooongword</td>
        <td width=50>550/50</td>
    </tr>
        <tr>
        <td style="overflow: hidden;" width=150>AnotherLoooooooooooonnnnnnnnnnnnnnnnGWord</td>
        <td width=50>660/50</td>
    </tr>
</table>

Firefox:

IE 9:

解决方案

Using the strict doctype it works in my IE9, I have the same result as in the firefox. I've tested with the code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    </head>
    <body>
    <form>
    <table border="1" width=200 style="white-space: nowrap; table-layout: fixed;">
        <tr>
            <td style="overflow: hidden;" width=150>Word with some spaces that isnt working in IE</td>
            <td width=50>100/50</td>
        </tr>
        <tr>
            <td style="overflow: hidden;" width=150>LoooooooooOOOOOOOOOoooooooooooooooooongword</td>
            <td width=50>550/50</td>
        </tr>
            <tr>
            <td style="overflow: hidden;" width=150>AnotherLoooooooooooonnnnnnnnnnnnnnnnGWord</td>
            <td width=50>660/50</td>
        </tr>
    </table>
    </form>
    </body>
    </html>

这篇关于空白:nowrap在IE 9中不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆