Div宽度不会调整为坐在浮动图像旁边

Question

我很难获得一个包含文本的div来减少它的宽度，以便很好地包裹在正确浮动的图像旁边。 div中的文本表现得像我想的那样，但是灰色div正在图像后面伸展。

div / box是wordpress短代码插件的一部分。我不知道这是否使问题复杂化

这是有问题的元素的css

---

图片：

.circular-image-right img {
    border-radius: 50%;
    clear: both;
    display: inline;
    float: right;
    height: 300px;
    margin: 0 30px 60px;
    width: 300px;
}

---

股利：

element.style {
    text-align: left;
    width: 100%;
}

 .symple-box.gray {
    background: none repeat scroll 0 0 #F9F9F9;
    border: 1px solid #DDDDDD;
    color: #666666;
}

.symple-box {
    -moz-box-sizing: border-box;
    border-radius: 2px;
    display: block;
    font-size: 1em;
    margin: 10px 0;
    padding: 30px 15px 5px;
}

---

有问题的页面可以在这里看到：

http://c3927181.myzen.co.uk/

Answer 1

http://jsbin.com/iLAMuXoc/5/edit?css,output

.symple-box.gray { 
  padding: 16px 30px; 
  margin: 0 360px 0 0;
  background: none repeat scroll 0 0 #F9F9F9; 
  border: 1px solid #DDDDDD; 
  color: #666666;
}