search

devlint / gridlex

Just a CSS Flexbox Grid System
http://gridlex.devlint.fr
MIT License
1.38k stars 144 forks source link

negative margin results in overflow for grid on smaller screens #26

Closed eikaramba closed 8 years ago

eikaramba commented 8 years ago

You can see this problem even on the demo page if you look at it on a smaller screen(e.g. 320px width). A scrollbar will appear and you can scroll to the right because of the negative margin for every .grid

One option maybe would be to refactor the grid gutter, so that it does not need this negative space trick, but instead uses some more complex selectors to address the first and last column (also will writing this i have to admit that might be impossible, as you never know what the last colum is ;) ) Maybe there is another option, or if everything fails just clear the negative margin for smaller screens.

Tested on FF latest, windows 10. (should be the same in every browser)

eikaramba commented 8 years ago

as a quick fix: body { overflow-x:hidden } would also work

devlint commented 8 years ago

Yep, because of negative margins... no alternative :( but yes, overflow-x is the better way to prevent scrollbar