0

I have installed Views Responsive Grid and I am on the way of replacing my old normal "views grid" in a couple of pages. But there is one thing I can't really understand. In the settings for Views Responsive Grid I am supposed to set a fixed number of columns. So if I go with 4 columns for example, and make it look good on a wide screen, the class "views-row" will continue on the next row if I make the screen more narrow. I must be missing something here. If for ex. I want to have a border under each row, no matter how many "cells" or "column divs" there are on each row... how to accomplish that? Am I supposed to set the number of columns to 1?

I should mention also that I have set the class .views-column to float:left in order for each column DIV to act responsive.

.view-id-taxonomy_term .views-column {
    padding-bottom: 15px;   
    padding-right: 15px;
    float:left;
}
.view-id-taxonomy_term .views-row {
    border-bottom: thin solid #d6d6d6;     
}
.view-id-taxonomy_term .views-responsive-grid .views-row-1 .views-column-1, .view-id-taxonomy_term .views-responsive-grid .views-row-1 .views-column-2,  .view-id-taxonomy_term .views-responsive-grid .views-row-1 .views-column-3,  .view-id-taxonomy_term .views-responsive-grid .views-row-1 .views-column-4, {
    padding: 10px 10px;
    vertical-align: top;
    max-width: 160px !important;
    min-height:320px !important;

}

Any hints would be much appreciated.

  • I doubt you'll be able to do that with Views Responsive Grid; it applies classes to the elements one after another, it doesn't introduce the concept of a row "wrapper", which you would need in order to apply the border you're talking about. Each of the .views-row elements is actually one of the grid items in this context, not a row of 4 grid items – Clive Jun 20 '16 at 9:50
  • Can you recommend another module or solution that would suit my needs? – TBJ Jun 20 '16 at 11:03

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.