Support » Plugin: PB Responsive Images » centered images

  • Resolved Frank

    (@fmacdonald)


    Hello,

    I see the plugin adds the class “aligncenter” to the span containing the image variations when it is center aligned in the wp-admin editor. As the span doesn’t have a defined width and is wrapped in an A tag i don’t believe it is possible to center align the image with CSS. Any ideas on how i can achieve this?

    http://wordpress.org/plugins/pb-responsive-images/

Viewing 1 replies (of 1 total)
  • Plugin Author Jacob Dunn

    (@spacemanspud)

    Sure – this becomes a CSS issue, and can be solved by a few quick corrections. If you look at the styles in the twentytwelve theme as an example, they have the following styles for images:

    /* Images */
    .alignleft {
    	float: left;
    }
    .alignright {
    	float: right;
    }
    .aligncenter {
    	display: block;
    	margin-left: auto;
    	margin-right: auto;
    }

    To apply those styles to images contained within those selectors, you just have to refactor them slightly:

    /* Images */
    .alignleft,
    .alignleft img{
    	float: left;
    }
    .alignright,
    .alignright img{
    	float: right;
    }
    .aligncenter,
    .aligncenter img{
    	display: block;
    	margin-left: auto;
    	margin-right: auto;
    }

    I kept the previous selectors in there as well, as it causes no issues to keep the backwards compatibility in this instance, just in case.

    Hope that helps!
    Jake

Viewing 1 replies (of 1 total)
  • The topic ‘centered images’ is closed to new replies.