Image alignment & text wrap/flow around images

you dont want align right, you want float right. or left. you have it in your css, but they mean nothing unless youve added the class to the image.

Didn’t have time to look at it in full but there is a ; missing from here (x marks the spot):

#content {
	font-size: 1.2em x
	}

Thank you EyePhoto, I fixed that.

I have the following in my css:

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

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

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

.right {
	float: alignright;
}

.left {
	float: alignleft;
}

In this linked post I have the image tag as follows:

<img src="https://cascajun.arabie.org/wp-content/uploads/2008/04/mudda-bugs-e-300x217.jpg" alt="A Serving of Crawfish in China" title="Mudbugs in China" width="300" height="217" class="alignright" />

The image isn’t aligned left and the text isn’t floating around.

Arrggg. I mean the image isn’t aligned right. It’s aligning on the left.

These two:

.right {
	float: alignright;
}

.left {
	float: alignleft;
}

should be the other way around:

.alignright (float: right;)

although you could simply add the floating to the img declarations…

yeah, moshu is right. and you also added the wrong class to your link. why would you add the “alignright” class when the “right” class is what has the float in it?

Ok, I think I get it. I’ve edited the css as follows:

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

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

And, in the image html tag I’ve included class=”alignright”. That got it working.

Thank you!

I’m having the same problem, I just created a new blog with 2.6 and my image is stuck on the left margin. I don’t know anything about coding, and am not sure exactly what needs to be changed where. I’ll try to see if I can edit the css file to get it to work.

Is there a fix in the works for this bug?? If not, will I have to change every frickin image reference in the css file? What’s the point of having WYSIWYG if you still have to screw around with code, which I HATE and am no good at??

BTWW, I have 2.5 installed on most of my sites and don’t have this problem.

great estates…

Did you get it fixed? i’ve been going nuts with my css for three late nights trying to trouble shoot it. I upgraded from 2.5 to 2.6 and started having those probs, too. I finally got it this afternoon. Like the posters above said, you need to have an image defined in your css. The trick is, certain themes have those imgs in diff div tags.

I’m using prosumer-10 as my theme. Simply inserting:

img.alignright {padding: 4px; margin: 0 0 2px 7px; border: #000000 1px solid; display: inline; float: right;}

img.alignleft {padding: 4px; margin: 0 7px 2px 0; border: #000000 1px solid; display: inline; float: left;}

Didn’t work. My posts were still wrong. What I had to do was to insert it into the div that hosts the content of the posts, like so…

#content img.alignright {padding: 4px; margin: 0 0 2px 7px; border: #000000 1px solid; display: inline; float: right;}

#content img.alignleft {padding: 4px; margin: 0 7px 2px 0; border: #000000 1px solid; display: inline; float: left;}

In my theme, the “content” div holds the post. Here’s its CSS:
#content {width: 510px;float: right;}

So I added the img to be defined within the content div.

Does this help you get any closer to a resolution (if you hadn’t already)? Hopefully this will help some others too.

Thanks, lonniw, this did the trick for me too.