Internet Explorer 11自动换行不起作用

时间:2013-11-22 16:26:36

标签: html css internet-explorer

似乎自动换行不再适用于IE 11中的textarea元素。在IE 10及更早版本中,FF,Safari和Chrome自动换行按预期工作。

IE 11没有实现任何自动换行。我尝试在textarea标签中添加“wrap = hard”,并添加“word-wrap:normal;”到CSS。

还有其他人遇到过这个问题吗?如果是这样,你找到了解决方案。 Windows正在推出此更新,并且不一致的行为正在成为一个问题。

感谢您提供的任何帮助。

这是我当前的textarea标签

<textarea class="wrklst-report_text" id="report_text_6586427" name="report_text[6586427]" title="Report Box" data-exam_seq="6586427" style="width:95%;"></textarea>

这是我的计算CSS

-webkit-appearance: textarea;
-webkit-rtl-ordering: logical;
-webkit-user-select: text;
-webkit-writing-mode: horizontal-tb;
background-color: rgb(255, 255, 255);
border-bottom-color: rgb(0, 0, 0);
border-bottom-style: solid;
border-bottom-width: 1px;
border-image-outset: 0px;
border-image-repeat: stretch;
border-image-slice: 100%;
border-image-source: none;
border-image-width: 1;
border-left-color: rgb(0, 0, 0);
border-left-style: solid;
border-left-width: 1px;
border-right-color: rgb(0, 0, 0);
border-right-style: solid;
border-right-width: 1px;
border-top-color: rgb(0, 0, 0);
border-top-style: solid;
border-top-width: 1px;
color: rgb(0, 0, 0);
cursor: auto;
display: inline-block;
flex-direction: column;
font-family: Verdana, Arial, sans-serif;
font-size: 16px;
height: 300px;
letter-spacing: normal;
line-height: normal;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
padding-bottom: 2px;
padding-left: 2px;
padding-right: 2px;
padding-top: 2px;
resize: both;
text-align: start;
text-indent: 0px;
text-shadow: none;
text-transform: none;
white-space: pre-wrap;
width: 950px;
word-spacing: 0px;
word-wrap: break-word;
writing-mode: lr-tb;

7 个答案:

答案 0 :(得分:72)

为了确保将来访问此问题的人明白答案:OP(wesley)在问题的评论中自己回答了问题:

问题的原因是Internet Explorer 11使textarea个元素继承了应用于直接父级的white-space属性。

决议是将white-space: pre-wrap应用于Jean-François Beauchamp标识的textarea。

答案 1 :(得分:10)

添加CSS

 {width: 100%} 

这会将文本换行到其标记

答案 2 :(得分:4)

我有类似的问题并通过将自动换行样式更改为分词样式来解决它:

{ word-break: break-all; }

答案 3 :(得分:3)

我来到这里是为了另一个问题,其中自动换行不适用于IE11;

{width: 100%}解决方案对我有用。

答案 4 :(得分:0)

请注意,IE11在兼容模式下不会正确换行。要获得它,请单击Alt,工具,Internet选项,安全性,本地Intranet,站点,高级。查看该列表中的内容。

答案 5 :(得分:0)

在IE 11中,通过将样式应用为 {断词:全部; }

答案 6 :(得分:-1)

对于IE(11.431.16299.0)的下拉菜单,我也遇到了类似的问题,并且我通过同时使用以下样式进行了修复

white-space:pre-wrap;
word-break:break-all;
相关问题