July 2014
M T W T F S S
« Apr   Dec »
 123456
78910111213
14151617181920
21222324252627
28293031  
BC Website Designer Canada - Freelance Web Development, Vancouver, BC - 778-848-7950

Monthly Archives: July 2014

A Simple Fix for WP Responsive Grid

This plugin is great, it styles your Native WordPress Gallery as a google styled responsive grid… I love it, I use it a lot, but it has one issue that has to be worked around in many themes. It picks up the CSS margin styling of the theme it is running in.

What needs to be done is a simple tweak to your theme’s CSS.

Embed an image on a wordpress page. Right click that image and open the inspector. Find your root elements using the inspector built into firefox or chrome, in many CSS files this is #main or something similar.

We will refer to this base element (which is the sheet’s overall width) as .main_width

the rule then should look like this:

.main_width img{margin:0 !important;}

Alternatively, you could put the gallery in an identified div, such as #Gridfix and add this to your gallery post:

<div id=”Gridfix”>[gallery]</div>

and this to your CSS file:

#Gridfix img {margin:0 !important;}

hopefully this will help a few people searching for the reason why their grid looks all messed up 😀 Happy Coding!