CSS如何将输入框附加到分隔器窗口的底部

我有一个包装分隔符，还有一个聊天窗口的子分隔符和一个输入文本框。但是我不知道如何在保持

float:left

属性的同时将

输入框保持在聊天窗口的下方，因为将有多个聊天窗口，我希望它们彼此相邻

这是我的一小部分


我缺少什么？
float
打开容器并从
中删除
float:left
。聊天窗口
应该会产生所需的结果。
默认显示为
块
，因此它会自动创建换行符，因此
自然出现在下面

多个
。聊天选项卡容器
将相邻浮动

CSS

.chat-tab-container {
    float:left;
}

.chat-window {
    background:#fff;  
    height:200px;  
    width:250px;  
    border:1px solid #ACD8F0;  
    overflow:scroll;
}

 .chat-window
    {
        float:left;
        background:#fff;  
        height:200px;  
        width:250px;  
        border:1px solid #ACD8F0;  
        overflow:scroll;
         position:relative;
    }

    .messages
    {

    position:absolute; bottom:0;
        float:left;
    }

HTML

<div class="chat-tab-container">
    <div class="chat-window"></div>
    <input type="text" class="messages"/>
</div>

<div class="chat-tab-container">
    <div class="chat-window"></div>
    <input type="text" class="messages"/>
</div>

  <div class="chat-tab-container">
        <div class="chat-window">
        <input type="text" class="messages"/>
            </div>
    </div>



。。。基本上浮动每个容器，而不是单个元素-如果“chat tab container”应该是顶级聊天容器，那么就有一个介于两者之间的级别。对于初学者，我会将文本框div放在聊天框div中。

HTML

<div class="chat-tab-container">
    <div class="chat-window"></div>
    <input type="text" class="messages"/>
</div>

<div class="chat-tab-container">
    <div class="chat-window"></div>
    <input type="text" class="messages"/>
</div>

  <div class="chat-tab-container">
        <div class="chat-window">
        <input type="text" class="messages"/>
            </div>
    </div>