0

我正在使用 jQuery 创建一个聊天页面,底部的发送按钮和消息向上。我希望包含消息的 div 在到达页面顶部时溢出,但它会继续扩展。

这是 HTML/jQuery:

<div style= "margin-top:0px;" data-role="page" id="politics">
        <div data-role="header">
            <a href="#home" data-icon="home">Home</a><h1>Chat about politics!</h1>
        </div>
        <div class="placeBottom" data-role="content">
            <div id="outputPolitics" style="margin-top:10px"></div>
            <input class="input-block-level" type="text" placeholder="Enter chat here" id="inputPolitics">
            <button id="buttonSendPolitics" class="btn">Send</button>
        </div>
    </div>

和CSS:

    #outputPolitics
{
    font-family: "Times new roman", Times, serif;
    background-color: #ebe8bd;
    height: 100%
    overflow:scroll;
}

.thread
{
    position: relative;
}

.placeBottom
{
    position: absolute;
    bottom: 0px;
    width: 90%;

}

我猜这与我在 div 上的位置选择有关。我在互联网上发现了这个“placeBottom”技巧,这是打嗝吗?

4

1 回答 1

0

你的问题很简单,你div没有身高,所以没有限制。

如果你想要一个固定的高度,div只需设置它就像height : 100%;

否则,如果您希望div使用文本,并且当它到达某个点时,滚动条工作,只需max-height: 100%;在您的上设置 a divheight:auto这是默认值。

请注意,您可以根据需要更改这些值。它可以是pxem或者任何你想要的!

于 2013-05-08T20:14:17.573 回答