Community Forums › Forums › Archived Forums › General Discussion › Is it possible to remove image padding in individual images
Tagged: image padding, image pixels, removing image padding
- This topic has 4 replies, 3 voices, and was last updated 9 years, 7 months ago by
Tom.
-
AuthorPosts
-
December 19, 2014 at 11:56 am #134905
nate
MemberHi
I am using the Genesis Eleven40 theme. It is default that there is a 12px padding at the bottom of the images. I don't think I want to remove this padding in general as I'm not sure how that would affect the rest of my images.
But I do want it removed on some occasions. Is it possible to remove this padding on individual images?
Any help with this is much appreciated.
Cheers,
http://snowboardingprofiles.com/
NathanDecember 19, 2014 at 3:34 pm #134925Tom
ParticipantA caution for what you want to do is that applying padding, margin or border styling to images individually (by plugin or manually) means that the styling is no longer controlled only by the theme but has become part of the content. When you change your theme the styling will still apply - and will not look as you may have expected.
Assuming the images are in pages or posts, one way to do this is to use the image identifier class and page identifier class that WP embeds with the image and page/post (e.g. "wp-image-1234" and "postid-5678"). You would add a statement in your child theme stylesheet to adjust the padding:
.wp-image-1234 .postid-5678 { padding-bottom: 0px; }
Each new image to be adjusted requires a new line in the CSS statement:
.wp-image-2432 .postid-2368, .wp-image-1234 .postid-5678 { padding-bottom: 0px; }
This keep the styling 100% separate from the content so that when you eventually change your theme the new styling will apply without any influences from tweaks embedded in the content and there are no remnants left in the content.
A second, initially easier solution, is to add a unique "Image CSS Class" to each image to be adjusted: e.g. "nobottompadding". You can do this in the post visual editor for each post image to be adjusted. Then add a single statement in your stylesheet:
.nobottompadding { padding-bottom: 0px; }
The upside is that you only have to mod the stylesheet once. The downside is that the class addition is now part of your content, even though it will be ignored by any new theme. (Possibly removed later using MySQL to clean up, but that is a separate topic.)
A third way is to use a plugin that adds adjustments to images, such as Advanced Image Styles which adds settings in the visual editor (in this case only for borders and margins). However, these settings are permanently maintained in the post content, even when the plugin is deactivated/deleted, and will remain in effect when you change themes.
Choose your next site design from over 350 Genesis themes.
[ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ]January 31, 2015 at 4:40 pm #139211nate
MemberHi Tom
Thanks for the response - I'm only seeing it now - I usually get an email when responses come in!
This was so that I could centre images vertically within a table. I have now figured it out. It was a matter of using
<img class="aligcenter wp-image-757" src=
I had tried using "aligncenter" and it did nothing but removing the "n" from the "align" seemed to do the trick. Not sure why but it worked so I'm not arguing!
Thanks again for your input.
NateAugust 18, 2015 at 6:54 am #162727acb8d2
MemberI have been trying to find where to eliminate the padding below all images in the CSS, but haven't been able to yet. I am in Magazine Pro.
August 18, 2015 at 11:55 am #162756Tom
Participant@acb8d2 Best to start a new thread with more detail about what you want to achieve; please include a link to your site. There's no single item to change all the images.
Choose your next site design from over 350 Genesis themes.
[ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ] -
AuthorPosts
- The topic ‘Is it possible to remove image padding in individual images’ is closed to new replies.