Need help? Check out our Support site, then


Adjusting the padding around an image

  1. I use a picture with nearly every post, usually placed in the upper left part of the post with the text wrapped around it. Is there a CSS code I can use to create a certain amount of padding around the image?

    For example, look here: I'd like for the text to not be so close to the image, especially on the side.

    I just began using the Manifest theme, and this piece of code came over from the previous theme I was using . . .

    .entry img {
    border:none;
    padding:0 7px 0 0;
    }

    I can't remember where I found that, but it must have worked. Only now, it isn't so much.

    Appreciate your help, and if you have questions, feel free to throw them out . . .

    Brian

    The blog I need help with is thecheekofgod.wordpress.com.

  2. Did you insert that image and then add the left alignment to it with the text alignment button in the toolbar? The reason I ask is that in the source code I'm seeing the text style left alignment code, not the image alignment code that you would see if you set the image alignment within the insert image window. The following is what you get if you set the alignment in the image insert process.

    http://flippintestblog.wordpress.com/2011/08/29/edit-image-caption/

  3. I should have mentioned this earlier . . . I usually write all my posts on Word's blog editor and upload directly from there. Using that code seemed to work in the past, but maybe for reasons other than what I imagined (?). I like what I see on the link you provided. Can I accomplish that and still use Word? Or am I doomed . . .

    ;-)

    And thanks so much for the help. I am a complete and utter newbie to CSS, so a simple solution is the best one . . .

    double ;-)

  4. I don't think you can on Word's blog editor, but you could I think using Windows Live Writer, which is very "word" like and works very smoothly with wordpress. I believe it uses the correct wordpress CSS classes for image alignment.

  5. Also, WLW is a free download.

  6. You could after uploading a post edit it in the wordpress editor and switch to the HTML tab and strip out the stuff Word puts in and then add the correct stuff to get the padding.

    Here is what the image part of the code for one of your posts looks like

    <img align="left" alt="" src="http://thecheekofgod.files.wordpress.com/2011/01/011311_0152_ring1.jpg?w=490">

    You would take out the align="left" and replace it with the class declaration like the following.

    <img class="alignleft" alt="" src="http://thecheekofgod.files.wordpress.com/2011/01/011311_0152_ring1.jpg?w=490">

  7. Right aligned images would be the same except you would use "alignright" .

  8. Thanks. Doing some fiddling this morning. See what I can come up with . . .

  9. You are welcome.

  10. So, if you are still monitoring this thread, I was wondering if you could clue me in a bit on Windows Live Writer. Downloaded it this morning, and it seems to be a cool program. My only problem? Read this . . .

    http://en.forums.wordpress.com/topic/windows-live-writer-2011-alignment-issue?replies=1

  11. Adding to the conversation here:
    I just switched to the Tapestry Theme and generally love it ... but the image padding is "Zero" and no shadow or anything. Was used to MistyLook, which had a good presentation of images.

    You can see what I mean by just looking at my user profile in the sidebar. This is the case in the rest of the blog as well. see this as eg. http://wp.me/p60SA-17w

    Is there a way to modify the image padding as part of the tag. I don't want to pay another $30/yr just to edit the CSS.

    Arun

  12. @arunshanbhag, you have the same issue. The image is aligned with the standard text align atribute instead of having the image alignment CSS class set. Do the same thing I told @tysdaddy to do above and you will get the padding to the right of the image.

    Shadows are another thing. Yes you can add it in the image code, but the problem is, there are 5 separate declarations that would have to be made in order to cover all browsers. It gets messy, and it might be that the wordpress software would strip out all that code anyway.

  13. Thank you,
    I played around with it and found that if instead of

    align="left"

    I use

    class="alignleft"

    Then I get the image padding and all. Prolly it calls up the CSS class set.

    Most of my images are hosted on photobucket and I link them on WP. It would be a pain to move the images all over on WP.

    Thank you for your kindness.

Topic Closed

This topic has been closed to new replies.

About this Topic