我有聊天消息，其中DIV正在下降

Question

我有聊天消息的div floatsleft和right但我的回覆是多於一行然後div跌倒。

請檢查我codepen div falling down

我想這樣的輸出：

Answer 1

不要讓你的bubble浮動，而不是使用左邊距。

http://codepen.io/anon/pen/grddmW

編輯：我更新的代碼。當然，正確的浮動泡沫也是如此。

.message .bubble { 
    background: #f0f4f7; 
    font-size: 16px; 
    padding: 12px 13px; 
    border-radius: 5px 5px 5px 0px; 
    color: #717070; 
    position: relative; 
    margin-left: 160px; 
} 

#chat-messages div.message.right .bubble { 
    border-radius: 5px 5px 0px 5px; 
    margin-right: 160px; 
    max-width: 79%; 
    text-align: right; 
} 

在這兩種情況下，都沒有浮動，而是左/右邊距。