I am trying to design the first Book Now button of this page (https://www.bridgecitychrysler.com/book-service/) to overlap onto the white section below the hero image. Even though I have set the z-index incredibly high, it is not showing up in front of the section below.
If someone is able to figure this out just in the inspect tool, that would be great!
Thanks,
3
Answers
Looks like your .hero-widget css has
overflow: hidden;
set, disabling that seems to have made it visible!Try removing
position:relative
from your button class.This makes the button reappear, and then remove
transform: translateX(-50%)
from thea
tag in the cta-container for proper alignment.Use pointer-events:none for these type of situation, when click events is not working for overlapped content, use pointer-events:none