i am not having any success getting meaningful grids with bootstrap. can you give an example of the fields to make this work.

i've set columns to 6.

i'm guessing... but under grid glasses i have "row" and i have removed all column row classes except for "every column" which i have set to

col-xs-6 col-sm-4 col-md-3 col-lg-2

please can you specify your working use cases and the scope of this module.

thanks

laurence

CommentFileSizeAuthor
#1 settings_example.jpg56.3 KBmmenavas

Comments

mmenavas’s picture

StatusFileSize
new56.3 KB

Hi laurencefass!

I got Views Responsive Grid to work with a Radix subtheme, and I used almost the same settings as you (see screenshot). Using 6 or 12 columns made no difference.

Did you get it to work? What are you using as a base theme?

screenshot

sonicthoughts’s picture

If anyone has cracked this - it would be great. not working as expected for small devices without BS breakpoints (ie. below 768px) I would expect it would just be fluid but cols are not collapsing :(.

iwhitcomb’s picture

@ laurencefass

Number of columns is just the number of cells to render per row, not the number of columns in the CSS grid. So unless you're intention is to have a view with 12 columns then this is probably wrong.

Your settings should probably look more like this:
Number of columns: 4
Wrapper: container-fluid
Every Column: col-md-3
Every Row: row

You can add classes for the other breakpoints, but keep in mind they're not all going to make sense. For example, col-sm-6 will stack them evenly(2x2 per row) thus giving the appearance of a grid still. col-xs-12 will be full width flowing down the page. Something like col-md-2 would look a little weird because it will only fill 8 grid columns and not the full 12(4 cells X 2 columns each = 8 grid columns).

The best way to think about this would be to start with the breakpoint where you want to display the most columns and work your way down by stacking them for the smaller breakpoints(if you need to).

@laurencefass -- Is it your md breakpoint the looks funny? Like 4 cells and then 2 wrapped down? 6 cells X 3 columns each = 18 grid columns(too many for bootstrap). Your workable options for a 6 cell view are col-md-1, col-md-2, col-md-4, and col-md-12.

kyletaylored’s picture

Status: Active » Closed (duplicate)
Related issues: +#2390355: Twitter Bootstrap Instructions