Mary_ Posted March 11, 2021 Posted March 11, 2021 Hi! I am having a problem with my gallery hover with link as it is not responsive (cannot be clicked) I have this code I found in this forum as well: //Gallery Hover// figure.gallery-grid-item { position: relative; } .gallery-caption { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; font-size:4em; color:white; } /* title */ .gallery-caption-content { position: absolute; left: 0; top: 0; right: 0; bottom: 0; display: flex; justify-content: center; align-items: center; z-index: 999; padding: 7%; } .gallery-section .gallery-caption p { font-family: Lato; font-weight: 700; font-size: 21px; color: #fff } /* overlay */ .gallery-grid-item-wrapper a:after { background: #000; content: ""; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; transition: opacity ease 200ms !important; } .gallery-grid-item:hover .gallery-grid-item-wrapper a:after { opacity: 0.40;} /* remove gap */ figcaption { padding: 0 !important; }
tuanphan Posted March 21, 2021 Posted March 21, 2021 Hi. Edit this /* title */ .gallery-caption-content { position: absolute; left: 0; top: 0; right: 0; bottom: 0; display: flex; justify-content: center; align-items: center; z-index: 999; padding: 7%; } to this /* title */ .gallery-caption-content { position: absolute; left: 0; top: 0; right: 0; bottom: 0; display: flex; justify-content: center; align-items: center; z-index: 999; padding: 7%; pointer-events: none; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
Recommended Posts
Archived
This topic is now archived and is closed to further replies.