akoenig / angular-deckgrid

A lightweight masonry-like grid for AngularJS.
http://akoenig.github.io/angular-deckgrid
MIT License
1.1k stars 191 forks source link

Update "The responsiveness" section #82

Closed Shingaz closed 9 years ago

Shingaz commented 9 years ago

Column size should be defined outside the media query to avoid flickering effect when triggered.

For exemple, the folowing code causes a flickering effect when the screen width goes from 991px to 992px (tested on Chrome version 42).

@media (max-width: 991px) {
    .deckgrid[deckgrid]::before {
        content: '2 .column.column-1-2';
    }
   .deckgrid .column-1-2 {
       width: 50%;
   }
}

@media (min-width: 992px) {
    .deckgrid[deckgrid]::before {
        content: '3 .column.column-1-3';
    }
   .deckgrid .column-1-3 {
       width: 33.33%;
   }
}
akoenig commented 9 years ago

Awesome, thanks. :)