Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

HTML Responsive Image Grid Gallery Space Between images

I use the image gallery below.
https://tympanus.net/Development/AnimatedResponsiveImageGrid/

I want to space between the two pictures.

If I put a div between the li and a elements, javascript will not find that a element. The height of the a elements inside the div 0.

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

I tried to modify CSS with padding, margin properties, but I was not successful.
I used the background-size: containt, to position the images well.

>Solution :

add background-size: calc(100% - 10px); to .ri-grid ul li a element.
10px represent the space between each picture. You’ll maybe need to change the background color of <li> and <a> to have a nice result.

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading