gpt4 book ai didi

html - li 元素中的空 div 在 Chrome 中添加了不需要的空间

转载 作者:行者123 更新时间:2023-11-27 23:54:13 29 4
gpt4 key购买 nike

我在 Chrome 中遇到一个问题,空的内容可编辑 div 导致有序列表内出现不需要的行间距。以下 HTML 在 Internet Explorer 中查看时按预期工作,但在 Chrome 中查看时,可编辑的 div 在为空时移动到数字下方。

<body>
<ol>
<li>
<div contenteditable="true"></div>
</li>
</ol>
</body>

下图显示,一旦文本被输入到可编辑的 div 中,内容就会显示在预期的位置,但是当文本为空时,内容会向下移动到 1 以下。

Example image

我想知道是否有我可以应用的 CSS 使空的 div 显示在 1 旁边,就像在 IE 中一样。

这是一个 fiddle .

最佳答案

忘记 div 元素。只需将 contenteditable 直接添加到您的 li http://jsfiddle.net/X8nLR/

<li contenteditable="true"></li>

或者如果你真的喜欢你的 div 去 http://jsfiddle.net/QXeA3/

div {
display: inline-block;
width: 100%;
}

关于html - li 元素中的空 div 在 Chrome 中添加了不需要的空间,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25046748/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com