In-line styling

[daddyalfie]

I have this page of "mutual links" for my customer.

 

He (rightly!) would like to move the thumbnail pictures of each establishment over into the bare, green area at the left where the menu resides.

 

Moving the pixs is no problem, but then I need to align each paragraph with its corresponding pix. I don't really want to create a separate class for each paragraph, and that leaves in-line styling.

 

Now my question: What is the syntax for adding an in-line margin style to a paragraph?

 

As always, many thanks!

 

Alfie

Edited May 23, 2011 by daddyalfie

[Andrea]

This should do it:

 

.left-justify{

text-align: left;

margin: 20px 35px 15px -170px;

}

 

.left-justify img{

float: left;

margin: 10px 10px 10px 0;

}

.left-justify p {margin-left: 170px;}

 

You may have to do some more fine-tuning and it would probably help to have the pics all the same width.

[daddyalfie]

This should do it:

 

.left-justify{

text-align: left;

margin: 20px 35px 15px -170px;

}

 

.left-justify img{

float: left;

margin: 10px 10px 10px 0;

}

.left-justify p {margin-left: 170px;}

 

You may have to do some more fine-tuning and it would probably help to have the pics all the same width.

 

HMM! So you are suggesting just shoving the pictures over in to the left and then the verbiage over to take up the space left. Interesting idea. I shall try it!

 

Thanks luv!

 

Alfie

[Andrea]

I tried it with the webdeveloper's CSS Edit feature, and it seems to work just fine. I fit screws up something else, create a special id or class for just that section.

[daddyalfie]

Brilliant solution Andrea! It worked like a charm, except I had to create a new class as the "left-justify" was used elsewhere. (And yes, I had to re-size some of the thumbnails.)

 

Thanks so much for a straight forward and easy solution!

 

Alfie