I’ve using the grid that Chris wrote about on this site.
its working fine but with one problem. I have 4 columns with a div element and with an image.
all columns have a padding right except the last one.
If you look at http://codepen.io/anon/pen/mtgAI
the right div is bigger.
the last column is now bigger. Any ways to get around this?
Thank you :)
This is your issue:
This reply has been reported for inappropriate content.
You need a “module” div to handle gutter: http://codepen.io/CrocoDillon/pen/ykCfA
(or try an alternative)
I know what the issue is, the module ive used is “.work”. Just wondering if there’s any way around this?
Okay so .work is your module but you still let the col- classes handle gutter, remove padding-right from them and add margin: 0 10px; to .work.
margin: 0 10px;
which works :)
Oh yeah, that would work as long as you don’t nest columns. padding: 0 10px; is the same as padding-right: 10px; padding-left: 10px; (assuming top and left is 0), but a lot shorter to write ;)
padding: 0 10px;
padding-right: 10px; padding-left: 10px;
You must be logged in to reply to this topic.