IE7 contentEditable word wrapping [英] IE7 contentEditable word wrapping
问题描述
我有以下代码：
I have the following code:
<html>
<style type="text/css">
DIV { display:inline; border: solid red 1px; }
.editable { background:yellow; }
</style>
<div class="editable" contentEditable="true"> This is test text. This is test text.This is test text.This is test text.This is test text.Thihis is test text.This is test text.</div>
<div class="editable" contentEditable="true"> short </div>
<div class="editable" contentEditable="true"> This is test text.This is test text.This is test text.his is test text.Thihis is test text.Thihis is test text.Thihis is test text.Thi </div>
我需要IE7（IE6不需要和FF3.x工作正常）来正确地包装文本，如果我从div中删除contentEditable =true，它会执行此操作。只要尝试使用这个代码，并且不使用contentEditable，你就会明白我的意思。使浏览器窗口足够小，以便看到文本是如何包装的。
And I need IE7 (IE6 not needed and FF3.x works fine) to wrap the text correctly, which it does if I remove the contentEditable="true" from the divs. Just try this code with and without contentEditable and you'll see what I mean. Make the browser window small enough so you see how the text wraps.
谢谢。
Thanks.
推荐答案
DEMO： http://jsbin.com/icavu4
试试这可以帮助解决一些问题！
try this can help solve a little the problem!
<!--[if gte IE 7]>
<style type="text/css">
.editable {
overflow:hidden;
float:left;
height:20px;
border: solid red 1px;
background: yellow;
}
</style>
<![endif]-->
更新：
UPDATED:
因为这可以被看作是一种解决方法，所以它可以让你像FF一样显示它，但是它会截断文本的最后部分
，你可能想要提供
使用
一点点的javascript来悬停编辑完整文本！
Since this can be considered a workaround in part, it allow you to display it like FF but it cut of last part of the text, you may want provide the full text to edit on hover by using a little bit of javascript!
这篇关于IE7 contentEditable word wrapping的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
