Div is on the text (p)

I have to put a div containing some images flush left, and soon after a title with a text. Side by side.

But I'm not getting.

The text is getting underneath the images. See the website: http://www.amsdarquitetura.com.br/Proje开发者_如何学Cct/Details?ProjectID=100

I like to put side by side (images and text)

Make both the text and image block elements:

img, p {
    display:block;
}

Try specifying width on the two floated divs such that they add up to less than 100%.

Set

width:50%; 

on the .left class (unless you use it elsewhere)

Alternatively you can set a class for each div and set a different width for each one.

The important thing is that the sum of those two does not exceed the width of their parent (#content).

It doesn't look like you'll be able to pull the light gray <span> away from the image, as it's part of the image's parent container.

Adding float:left; width:200px to your <div class=left> container brought everything up to the right of the image...sans the gray <span> element.

Is it possible for you to refactor the code - moving that <span> into <div class="left">?