Menu icon Foundation
Remove Whitespace - Block Grid Img

I have three images that are a block grid

I want to remove all the white space between them on all sizes

I have been playing around with this and managed to get the images bumped up against each other in the small - not even sure now what I did. but how do I achieve this for medium and larger. 

I am not using Sass, so solution needs to be CSS

Thank you

 

 

block gridspacing

I have three images that are a block grid

I want to remove all the white space between them on all sizes

I have been playing around with this and managed to get the images bumped up against each other in the small - not even sure now what I did. but how do I achieve this for medium and larger. 

I am not using Sass, so solution needs to be CSS

Thank you

 

 

Rafi Benkual almost 3 years ago

You can add a .collapse class to .row to remove padding. We did a lesson on block grid that will help here: http://zurb.com/university/lessons/don-t-let-your-grid-be-a-blocker-foundation-s-block-grid

 

And the .collapse class is demo'd in this lesson (last item) http://zurb.com/university/lessons/get-more-control-with-foundation-s-grid-utiltiy-classes

 

Hope it helps!

teri pastorino almost 3 years ago

Hi RafiI rearranged order, removed any

Thank you for the videos I hadn't found the utilities one yet. Tried a bunch of things and nothing is working.

I rearranged order, removed any css I had added 

What I have tried:

column

column column-block

taken out my <div> class="wrap"

collapse

large-collapse 

small-collapse medium-collapse large-collapse

 

no combination seems to work

no additional css applied to any of these classes

.thumbnail-main only removes the border outline around the image

no img css 

 

Suggestions?