I'm using CSS to make a masonry effect in Views. And it works, but... The exposed filters and the pager get "caught" in the masonry effect instead of being on top (and bottom) of the results.

Question : how to set the CSS so that the exposed filters and the pager stay out of the results.


ps.: I know about Masonry views, but I prefer CSS.

The CSS:

In Views "Other" : CSS Class

.brick-user {
    margin: 1.5em 0;
    padding: 0;
    -moz-column-gap: 10px;
    -webkit-column-gap: 10px;
    column-gap: 3em;
    font-size: .85em;

Settins : Row class

.brique-user-item {
    display: inline-block;
    background: #fff;
    border: 1px solid lightgrey;
    padding: 15px;
    margin: 0 0 1.5em;
    text-align: center;
    width: 100%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;


1 Answer 1


You could use the "Exposed form in block" setting under Advanced settings to get the exposed filter out of the masonry markup and put it a region above or beneath your masonry view.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.