WordPress.org

Ready to get started?Download WordPress

Forums

Do I have to change the CSS in 2012 to wrap text around an image? (3 posts)

  1. Little Laura
    Member
    Posted 11 months ago #

    Website: creaturecomfortsofbalto.com

    I read the detailed instructions here:
    http://codex.wordpress.org/Wrapping_Text_Around_Images

    ... but the first line says in recent versions you don't have to do this (add code to accomplish text wrapping)

    Nevertheless, I checked the Twenty Twelve Style sheet and was surprised there was nothing pertinent to images. (searched img)

    So I copied code and pasted it into my 2012 child theme (and obviously, I haven't a clue what I'm doing):

    img.alignright {float:right; margin:0 0 1em 1em}
    img.alignleft {float:left; margin:0 1em 1em 0}
    img.aligncenter {display: block; margin-left: auto; margin-right: auto}
    .alignright {float:right; }
    .alignleft {float:left; }
    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; }
    
    /*Pug Image on Contact Page*/
    img.decoded {
        background: url("chrome://global/skin/media/imagedoc-lightnoise.png") repeat scroll 0 0 #E5E5E5;
        color: #aa812e;
        border:0;
    }

    And no progress; I just want to put this text next to the pug image on the Contact page:
    Questions?
    Feel free to call or text me: 443-722-1529
    Email: laura@creaturecomfortsofbalto.com
    Or fill out the form below:

    Thank you for your help.

  2. WPyogi
    Volunteer Moderator
    Posted 11 months ago #

    No, you don't need to add any CSS for images to align - that's already in the theme - it's required by WP for all themes.

    The image in question does not have any alignment set - you can see the HTML here:

    <img class="alignnone size-medium wp-image-100" width="273" height="300" src="http://www.creaturecomfortsofbalto.com/wp-content/uploads/2013/09/Questions1-273x300.jpg" alt="OLYMPUS DIGITAL CAMERA">

    When you insert the image - after you click on the image to be inserted, look at the right side of the screen where it says "attachment details" - at the bottom, there is a pull down menu for "Alignment" - use that to put that image to the left or the right side of the text.

  3. Little Laura
    Member
    Posted 11 months ago #

    Ah. It's usually a hundred times easier than what I'm trying. Thanks for your continued helpfulness, WPyogi.

Reply

You must log in to post.

About this Topic