LightBox Gallery Material Box IMG Height/Width

Topic: LightBox Gallery Material Box IMG Height/Width

Daniel pro asked 9 years ago

Creating a default LightBox Gallery Material Box, what are the IMG Dimension we should use? Weirdly the code adjusts the width of any image automatically to fit fine in the Gallery but not the Height. If we use default height:auto; the height is original and will be messed as not every IMG has same height. What are the correct / ideal IMG Dimensions we should use on Upload of Media? I assume that all Media must be the exact same size to work finely in this kind of gallery. Of course we can crop, but then we will have gaps between the single image (gallery) items. Thank you

Add comment

Michal Szymanski staff pro premium priority answered 9 years ago

0 0 Best answer

The thing is a little bit tricky. Because LightBox Galllery uses Bootstrap Grid to provide a responsiveness, each column has a defined width. In our example from documentation for each image width is 1/3 of available space (because we use bootstrap columns "col-md-4). The height isn't defined, but it can be. But then we risk that our images will be cut or streeched (depend if we set "overflow" to "hidden" or not). So the best way to provide a high quality images in gallery and the best user experience is to prepare images in the same size. Then you can be sure they will be always display perfectly.

rjmead23 pro commented 7 years ago

I'm creating charts from out of Excel which I'm then pulling into the lightbox.. I've found that even though I set the images to exactly the same size in Excel, all of the images don't line up properly.. Are there any more details you can offer around how to make sure the images work in a lightbox?

Add comment

Daniel pro answered 9 years ago

0 0 Best answer

Yeah, that's what I suspected. Best practice begins in best preparation of content :D thank you Michal, still fully convinced of MDB :)

Add comment

Michal Szymanski staff pro premium priority answered 9 years ago