Overriding Gallery Margin

Continuing the build on a free theme. Working on the gallery CSS. WordPress automatically adds a left margin to the gallery. Example: http://themeforward.com/demo2/features/gallery-2/ So, how do I get rid of that nasty margin?

/* Gallery */
.gallery {
margin:30px auto auto;
text-align:center
}
.gallery-item {
float:left;
margin-top:10px;
text-align:center;
width:33%
}
.gallery img {
border:1px solid #E6E6E6!important;
margin-bottom:27px;
padding:5px
}
.gallery img:active {
margin:1px 0 0
}
.gallery-caption {
display:none;
font-size:.8em;
margin-left:0
}
.gal_img {
margin:20px auto 0!important;
text-align:center
}
.gal_caption p {
font-size:1.3em!important;
font-weight:700;
text-align:center;
font-family:Arial, Helvetica, sans-serif!important
}
.gal_description p {
font-size:1.1em!important;
text-align:center
}

1 Answer
1

The simplest method is to remove the WordPress-injected inline style definitions, so that you can control style completely via the Theme:

/**
 * Remove default gallery shortcode inline styles
 */
add_filter( 'use_default_gallery_style', '__return_false' );

Note that this will remove ALL WordPress-injected gallery CSS definitions, so you may need to port some of the original style definitions into your stylesheet.

Leave a Comment