Css Float???

Hi All,

I am relatively new to styling my layouts with pure css, I am a table layout designer trying to make the switch to css.

I am wanting to add an image to my layout to the right of my div container, I am looking to do something like below but using css.



If you could possible set me in the right direction it would be most appreciated.

Wayne

The image should be inside the div with the text, and you need to give it a class something like this:

HTML

Code: Select all

<img src="yourimage.jpg" alt="your image description" class="floatRight" />

CSS

Code: Select all

.floatRight {
float:right;
padding: 0 0 0.5em 0.5em;
}

The float: right floats it in the text, and right makes to float on the right rather than left. The padding is just so there is a bit of spacing between the left and bottom edges of the pic and the text. Remember when padding you can do the values as

padding: top right bottom left;

Thats what i've done above.

Would I need to put a div class around my image?

sorry I have just noticed the class in the image source

Wll that didn't post properly. but if you understand then...I'll leave it at that!