我有一个名为“container”的div,其中包含通过JavaScript动态创建的内容(段落)。问题是,一旦段落超出容器的边界,它们就不会显示在div上。为了解决这个问题,我尝试使用overflow,但这只会添加x,y滚动条。
我想要做的是,在每个添加的段落后增加容器的高度,即当段落添加到高度为20px的容器中时,容器的高度增加到下一个段落的40px。 HTML
有什么建议吗?谢谢!
我想要做的是,在每个添加的段落后增加容器的高度,即当段落添加到高度为20px的容器中时,容器的高度增加到下一个段落的40px。 HTML
<div class="container"></div>
<a href="#" id="add">Add content</a>
CSS
.container {
width: 120px;
height: 20px;
display: inline-block;
margin-left: auto;
margin-right: auto;
/* overflow: auto; */ //As aforementioned, I'm not in favour of scrollbars
background-image: url('http://i.imgur.com/dfzk0TW.png');
}
Javascript
$(function () {
$('#add').on('click', function () {
$('<p>Text</p>').appendTo('#container');
});
});
有什么建议吗?谢谢!