Keep text from wrapping around floated image

问题:

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.

回答1:

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;
}

回答2:

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

回答3:

Try setting fixed width if possible and Justify your text