防止文字环绕浮动图片

Question

I currently have an image that is floating left, and a block of text that rests to the right of it. That block of text is not current floated, it just comes after the image in the HTML. So as it gets longer it eventually kicks over to the left under the image to continue on.

How can I make it so the block of text always stays to the right of the image, so the image and the text behave like two side-by-side columns? Bear in mind that I cannot do anything outside of these two elements. I cannot add a wrapper around them. I can add elements before, between, or after. But not around.

Thanks.

Answer 1

p
{
width:1000px;
display: table-row;       
}

Answer 2

FIXED ANSWER

Just float the text as well. :)

http://jsfiddle.net/Hs7pN/

#image
{
    background-color: #09C;
    float: left;
    height: 200px;
    width: 200px;
}

#text
{
    float: left;
    width: 400px;
}

Answer 3

尝试设置固定宽度（如果可能），然后对齐文本