html - 将图像放置在 div 旁边(聊天气泡)

Question

我在“聊天气泡”旁边有一个用户的图像，但该图像显示在气泡之后。

我如何将图像放在聊天气泡之前并固定在 div 上？

我的代码在这里:http://www.codepen.io/anon/pen/fFxtl

谢谢。

Answer 1

这就是你想要的吗

http://www.codepen.io/anon/pen/afyuj

.bubble2{
 float:left 

}

.bubble
{
text-align:left;
color:black;
float:left;
position: relative;
background: gray;
border-left: 2px solid #e67e22;
margin-bottom:3%;
margin-left:0;
padding:5px;
}

.bubble h4 {text-align:left;font-size:14px;font-weight:bold;font-variant:small-caps;clear:both;margin-bottom:3px;padding:0;margin-top:-5px;color:#2ecc71;}
.bubble span {font-size:17px;line-height:1px;font-family: TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif;}