Question

我有关于嵌套div的问题。这两个div都是可编辑的。问题是如果我在div中写内容（即简单文本），然后将光标放在内部（子）div的开头，然后按退格键，它会移动父div中的文本。为什么会这样？我知道这是默认行为。什么可以解决这个问题？

<head>
    <title>----</title>
</head>

<body style="100%">
    <br />
    <br />
    <br />

<div contenteditable="true" style="min-height:80%; min-width:100%; background-color:#00ffff">
    <div id="test" style="margin:auto; width:100%; background-color:#e3e3e3; 
border-width:5px; border-color:e9e9e9; word-wrap: break-word; overflow:hidden;  
min-height:25px;" contenteditable="true">

        Child Div Text here!!!

    </div>
                    Parent Div Text Here
</div>

</body>

的问候，艾哈迈德

Answer 1

这可能不完全正确，但我认为你的div移动的原因是因为你设定孩子宽度的方式div。如果你对孩子width:100% div div，那么div的大小将会拉伸以包含所有间距。您还没有指定任何位置属性，因此父div会将自己放在孩子div旁边。这意味着对子' '的位置和宽度（随着您拥有的div的数量而变化）的任何更改也将更改父div的位置。如果您不希望父width移动，则需要A）为子div指定一个集div，或者为每个{{1}设置一个位置}}。如果你有一个css文件，它看起来像这样：

A）

/* You would need to add IDs to each div so I am just going to do child */
#child
{
   width: 200px; /* Set number */
}

或

B）

#child { position: absolute /* Or however you wish to do this */ top: 10px; /* Some number */ left: 10px; /* Again whatever number */ }

嵌套Divs退格问题

1 个答案: