Image and Text – vspace hspace

Start here: Using_Images
(the theme doesn’t really matter)

i’d been having the same problem. thanks for posting the link.

there are so many intricacies involved in not only designing, but posting as well. although everything can be established through the stylesheet, it is a good idea to weight it down with everything relative to the blog? or, is it recommended to break it up – i.e., one stylesheet for the overall design, and one for text, image, and other rich media classes / stylings?

I never have more than one stylesheet for a theme. I don’t see anything complicated.
You have a post div, p tag and left/right images.

i guess i’m not using the standard image tags – using a few different styles and lightbox, too. one style is for icons that uses no borders or padding, one for pics that have ‘framed’ borders, and one for linked images. if i want to align, use an inline tag/parameter through the post.

a div, a p, and left right images? I knwo div and p, but what is this left right images about? What does the code to make that happen look like?

img.alignright {
float: right;
padding: 4px;
margin: 0 0 2px 7px;
display: inline;
}

img.alignleft {
float: left;
padding: 4px;
margin: 0 7px 2px 0;
display: inline;
}

Here is the CSS. Here is how you use it!

<img border="1" class="alignleft"

And you can put even the border in the CSS.

Hmmm, I tried to add a border and hspace via the style sheet. When I’m in edit mode on the post with the image, it shows up correctly. When I save and head back to the main page, the formatting is gone.

What am I missing?

Ack, found the problem. The style sheet for the theme I’m using had a style already set for img that I hadn’t seen.

Anyway, I think I’ve got it working the way I want. ??

I’m having trouble wrapping image around text NOT USING hspace or vspace. if these won’t work in the new XML, I want to change now…

I usually place,
‘style=”float: left” hspace=”20″‘, next to the img code when I post.

So i added to my stylesheet the following…

‘img.right { padding: 4px; margin: 0 0 2px 7px; display: inline; }

img.left { padding: 4px; margin: 0 7px 2px 0; display: inline; }

.right { float: right; }
.left { float: left; }’

then put ‘class=”left”‘ by my image code.. according to https://codex.www.ads-software.com/Wrapping_Text_Around_Images
this should work. It doesn’t.

What am I missing?

I also tried this in stylesheet..

p img {
padding: 0;
max-width: 100%;
}

img.centered {
display: block;
margin-left: auto;
margin-right: auto;
}

img.alignright {
margin: 0 0 2px 7px;
display: inline;
}

img.alignleft {
margin: 0 7px 2px 0;
display: inline;
}

.alignright {
float: right;
}

.alignleft {
float: left;
}

and class=”alignleft” in my post

it still isnt working.