Need help? Check out our Support site, then

Photo alignment with text.

  1. Hi! I'm having an awful time with an issue and cant seem to figure it out. Here is the problem. I write text then add a photo and everything is uneven.

    How do I have the text wrap around the photo? And, how to I have the text level with the top of the photo line? Thanks!

  2. This is relatively simple to do, but you need to be in Code Editor to do it. When you insert an image, there will be a line of code that starts <img src="http://....

    To make the text wrap, you need to add some code, such as:

    style="padding-right:10px;padding-bottom:0;float:left;" before the closing ">".

    You can see what this looks like at this page

  3. /nod to wolfieb
    To get the text to wrap, you can also, while in the visual editor, click on the image so that it is highlighted (little handles at the corners) and then click on the left or right text align button in the toolbar depending on whether you want the image at the right side or the left side. Then the text will flow around it.

  4. @tsp
    That's something I didn't know (but I tend not to use the WordPress editor to write my posts) but certainly sounds easier than messing about with code. Thanks for the tip.

  5. @tsp
    Just tried it and it is much simpler than my way. The only down side (for me, anyway, maybe not for others) is that you still have to edit the code if you want to add in any padding, so that the text doesn't go right up to the edge of the image.

  6. If you put the image in, click on it, icon #12 is available. Click on that icon and it brings up the image link properties.

    I've not yet figured out how to adjust the margin (so that the text doesn't butt up against the image) except manually through the code editor.

  7. @wolfieb
    If you look at the code using my way, it isn't exactly right from an official html standpoint either. If you click the "clean up messy code" in the extended toolbar though it will make it pretty.

    For padding, if you highlight the image and then click on the image icon in the toolbar, it will bring up a little window where you can add the padding.

  8. Actually it allows for hspace and vspace.

  9. @tsp
    Thanks for that, but viewed in Flock it doesn't seem to work; it initally draws the spacing, and then gets rid of it and puts the text right up against the image. (Although, viewed in Safari it does work - that would seem to suggest the created code is not 100% standards complaint).

  10. You need to adjust the margin as I mentioned above.

Topic Closed

This topic has been closed to new replies.

About this Topic