jenil/chota

Grid Layout Overflow Problem

iocron opened this issue · 3 comments

iocron commented

The Grid Layout should be usable without a container (e.g. .container) / defined parent width as well. Otherwise the row is wider than 100% of the body and creates a horizontal scrollbar. I would recommend adding .row { max-width:100%; } then this Problem doesn't appear anymore.

jenil commented

@iocron can you share a codepen?

iocron commented

@jenil https://jsfiddle.net/iocron/Ltjyr260/

Once the full width of the body is used the problem appears. The grid layout shouldn't be fully dependend on a container and I don't see a reason why a row should be wider than 100% The use of .row { max-width:100%; } can fix this behavior.

jenil commented

@iocron I see what you mean, I think the grid is designed to be used with container, in order to get you need you should use --grid-maxWidth
https://jenil.github.io/chota/#grid