html内联块如何显示,html – 如何将div与显示内联块对齐？

我希望第一个div与右边对齐,如果我使用float右边它会将第二个div放在我不想要的同一行上,我的目的是让第一个div对齐到右边而不会丢失它的块级别在聊天应用程序中

任何帮助将不胜感激. .谢谢

注意：我使用display inline-block只是因为我希望div符合内容.

.outer{

display: block;

}

.lbubble , .rbubble {

position: relative;

padding: 5px;

-webkit-border-radius: 5px;

border-radius: 5px;

-webkit-box-shadow: 2px 2px 10px 0px #616161;

box-shadow: 2px 2px 7px 0px #616161;

display: inline-block;

margin-bottom: 8px;

}

.lbubble{

background: lightblue;

}

.rbubble{

background: lightgreen;

}

.lbubble:after {

content: "";

position: absolute;

top: 5px;

left: -8px;

border-style: solid;

border-width: 10px 14px 10px 0;

border-color: transparent lightblue;

width: 0;

z-index: 1;

}

.rbubble:after {

content: "";

position: absolute;

top: 5px;

right: -8px;

border-style: solid;

border-width: 10px 0 10px 14px;

border-color: transparent lightgreen;

width: 0;

z-index: 1;

}

Right Bubble with align right

Left Bubble it should be on 2nd line with align left