Recent Topics

1 Mar 20, 2006 08:28    

When I post a blog, is it possible to put text next to a small image?

At this moment i can only put text above or underneath an image.

3 Mar 21, 2006 04:56

sonics,

The trick is to FLOAT the image, either right or left, which allows the text to flow AROUND the image.

There are several ways of doing this and EdB points out the concept of including a class name (that is presumed to exist in your CSS file).

You can use your own class name. In your blog entry, add an image like this

<img class="left" src="http://yoursite.com/picture.jpg" alt="altText" title="titleText" />

(Note: "left" is OFTEN a class name that DOES just that ... floats things left. This may work for you without any other input on your part. Try it. If it works out of the gate, great ... if not ... then read on.)

In the CSS file for your skin, you can add the following selector and directives to style the class name "left"

img.left { float:left; margin:2px 10px 2px 0; border:1px solid #000; }

The above CSS will apply to any IMG with a class name "left" . It floats those images left (wrapping text around it) and adding a 2px margin top/bottom, a 10px right margin and no left margin. It also adds a 1px-wide, black, solid-line border around the image.

You can play with the styling in your CSS file, to get the look just the way you want, but it's the FLOAT directive that allows text to "flow" around the image.

Hope this helps.

Cheers,


Form is loading...