空白:nowrap在IE 9中不起作用 [英] white-space: nowrap not working in IE 9
本文介绍了空白: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
<!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屋!
查看全文