html - 2 つの CSS 要素を一緒に持つ

Question

2 つのブーブレ スピーチを一緒に行いたいと思います。下の画像

これはこれを行うための私のコードです:私はこれのためのデモをここに持っています: http://jsfiddle.net/pZh4w/

<style>
.bubble 
{
position: relative;
width: 525px;
height: 130px;
padding: 4px;
background: #FFFFFF;
-webkit-border-radius: 31px;
-moz-border-radius: 31px;
border-radius: 31px;
border: #46A5E4 solid 9px;
display:inline-block;
margin-bottom: 0px;
margin-right: 50px;
}

.test
{
    margin-bottom: 0px;
    margin-left: 850px;
}
.test1
{
    margin-bottom: 20px;
    margin-left: 850px;
}

.tes
{
    margin-bottom: 0px;
    margin-left: 250px;
}
.tes1
{
    margin-bottom: 20px;
    margin-left: 250px;
}
</style>  

ご協力いただきありがとうございます。