Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Not visible on mobile #61

Closed
mtsweir opened this issue Jan 12, 2018 · 5 comments
Closed

Not visible on mobile #61

mtsweir opened this issue Jan 12, 2018 · 5 comments
Labels

Comments

@mtsweir
Copy link

mtsweir commented Jan 12, 2018

A few issues here, when I preview the demo in Chrome Dev Tools, there is just white space where the grid should appear. What the issue could be is that you override the height of ".gridder-list .image" to auto which essentially removes all heights, if I remove the auto height it then shows the grid.

Another issue is when the one grid element is expanded the content doesn't expand fully and overlaps any grid elements below. I added a min-height to the ".gridder-show" div so I could a least set a manual height, but in the real world, this will always vary.

screen shot 2018-01-13 at 9 26 09 am

Uploading Screen Shot 2018-01-13 at 9.22.10 AM.jpg…

@jordan-webdev
Copy link

I am wondering, too, if there is a solution to this. Ideally, this has to be mobile-friendly in order for me to use it on any responsive site. mtsweir, did you come up with any other solution?

@orion3dgames
Copy link
Owner

orion3dgames commented Jan 31, 2018

This is not a bug and you need to update the CSS to cater your needs, be it responsive or not.

In this example http://oriongunning.github.io/gridder/ , you will see that the expanded content displays correctly.

@mtsweir
Copy link
Author

mtsweir commented Jan 31, 2018

I grabbed the latest from this repo and previewed in Chrome (64)
This is what I am seeing...

screen shot 2018-01-31 at 7 56 55 pm

While it kind of works, I need to do many fixes (css resets, style tweaks) just to get it stable.

The http://oriongunning.github.io/gridder/ demo example seems more complete, should I be using this or the Github version?

@orion3dgames
Copy link
Owner

orion3dgames commented Feb 2, 2018

The demo has been updated a little to show you how to achieve responsiveness.. Basically, I only provide the strict minimum CSS for GRIDDER to work. If you want it to responsive, you can achieve that very easily with media queries but it is outside of the scope of GRIDDER.

@mtsweir
Copy link
Author

mtsweir commented Feb 2, 2018

Cheers for following this up.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants