Close

Accordion Image Gallery

This is an example of an accordion image gallery, designed using HTML, CSS, and Bootstrap framework 4. The background images are imported to the code with their URLs. The body of the image container is given the styles of padding as 75px 0, margin as 0 auto, and width as 1140px. The form title is given the styles of position as relative, margin-bottom as 45px, font-family as 'Oswald', sans-serif, font-size as 44px, text-transform as uppercase to get the hand cursor effect, and color as #424242. The image gallery wrap is given width as 100%, and height as 70vh, whereas the image is given width as 32px. The accordion item has the styles of flex as 1, height as 100%, background-position as center, background-size as cover, transition as flex 0.8s ease, which turns its flex value to 7, in a hover event to increase the size of the image. Source: https://codepen.io/stefcharle/pen/Gydvbx

Post Comment or Questions

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Several Related Snippets

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.