Html IE7内容可编辑字包装_Html_Internet Explorer_Internet Explorer 7_Contenteditable

Html IE7内容可编辑字包装

html internet-explorer

Html IE7内容可编辑字包装,html,internet-explorer,internet-explorer-7,contenteditable,Html,Internet Explorer,Internet Explorer 7,Contenteditable,我有以下代码： <html> DIV{display:inline；border:solid red 1px；} .可编辑{背景：黄色；} 这是测试文本。这是测试文本。这是测试文本。这是测试文本。这是测试文本。这是测试文本。这是测试文本。短这是测试文本。这是测试文本。这是测试文本。这是测试文本。这是测试文本。这是测试文本。这是测试文本。这是测试文本。这是测试文本我需要IE7（IE6不需要，FF3.x可以正常工作）来正确包装文本，如果我从divs中删除con

我有以下代码：

<html>


DIV{display:inline；border:solid red 1px；}
.可编辑{背景：黄色；}

这是测试文本。这是测试文本。这是测试文本。这是测试文本。这是测试文本。这是测试文本。这是测试文本。
短
这是测试文本。这是测试文本。这是测试文本。这是测试文本。这是测试文本。这是测试文本。这是测试文本。这是测试文本。这是测试文本

我需要IE7（IE6不需要，FF3.x可以正常工作）来正确包装文本，如果我从divs中删除contentEditable=“true”，就会这样做。只要尝试一下这段代码，无论有没有contentEditable，你就会明白我的意思。使浏览器窗口足够小，以便查看文本的换行方式

谢谢。

您尝试过溢出属性吗？
我的！IE开发者工具栏显示
contentEditable
触发器
布局基本上意味着元素是矩形的

虽然有好几次黑客攻击迫使一个
布局
，但我认为实际上没有办法删除它（
为什么不为div使用
display:block
如果它们确实需要内联，甚至可以使用
inline block
：
请注意，根据IE 6和7中的支持，这一点是不完整的

示例：
您是否尝试使用SPAN而不是DIV
SPAN标记是内联的，不需要display:inline

很抱歉，我没有尝试，但目前我没有任何IE7。
亲爱的朋友，所有版本的IE都有一些缺点。特别是在解析样式表方面。对于每个版本，必须修改sytle规则。我建议，您必须为每个版本使用样式规则。ie style hacks。据我所知，ie 6版本是所有ie版本中最好的。它可以正确显示您在样式表中编写的内容。
演示：
试试这个可以帮你解决一点问题



更新：
由于这在某种程度上可以被视为一种变通方法，因此它允许您像FF一样显示它，但它会剪切文本的最后一部分，您可能需要提供使用鼠标悬停时要编辑的全文一点点javascript

简短回答：如果您使用
display:inline block
而不是
display:inline
，那么所有其他浏览器的行为都将类似于IE
详情： IE9的行为方式相同。 SPAN的行为与
DIV{display:inline}
相同，它应该这样做。彭彭80在9月1日的反应是最好的。基本上，ContentEditable在IE中必须是矩形的。因此，SPAN和DIV在IE中都呈现为
display:inline block
。我在内容管理系统中一直使用ContentEditable。我利用了“功能”，这样当可编辑DIV最初为空时，用户就有了一些空间可以使用。在您的示例中，如果您删除了“short”中的所有文本，那么祝您好运，让光标回到元素中，以便将文本放回。它只是折叠为零。在CMS中，根据用户是否选择了编辑或预览模式，我会关闭和打开ContentEditable。同时，我会在内联和块/内联块之间切换显示，并关闭和打开编辑辅助线（红色边框）。
…Tom
IE8的行为与IE7相同，以防您好奇。我在IE8中发现了完全相同的问题。我尝试使用-ms word break:break all解决问题，以向ie表明我希望默认换行，但没有机会。所有其他浏览器都能正确执行此操作。
<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>

