Question

正如你所看到的那样＆＃34; .template-1＆＃34;固定高度和＆＃34; .card-container＆＃34;有溢出隐藏

问题是当我们在.text字段中输入一些文本时，它的高度会向顶部增加，而顶部的所有元素都会被隐藏。

如果我删除了内容，则可以使用可编辑的true或预先插入的文本。它可以正常工作。

我想要的是 - 在卡片容器的超出（底部）输入时内容/文本应该隐藏 - 而不是隐藏上层元素，即。图像和.title

以下是代码段

<div class="template-1">
  <div class="card-container">
    <div class="card-content">
      <div contenteditable="true" class="title editable-field">title title title</div>
      <div class="visual">
        <img src="http://placehold.it/155X55">
      </div>
      <div  class="text editable-field">
        Text text 
      </div>
    </div>
  </div>
</div>

.template-1{
  height: 200px;

}
.card-container, .card-container{
  height: 100%
}
.card-container{
  overflow: hidden;
  border: 1px solid green;
}
.editable-field{
  border: 1px solid red;
}

和Jsfiddle相同 https://jsfiddle.net/qkmLsy4h/

编辑：.editable-field将有高度：auto;总是

内容可编辑的真实内容隐藏问题

0 个答案: