VulcanJedi Posted June 5, 2022 Posted June 5, 2022 Site URL: http://www.planetcreative.co Hello! I've used CSS to create a hover effect for desktop over poster images using this CSS: @media only screen and (min-width:834px) { .design-layout-poster .image-card-wrapper { visibility: hidden; opacity: 0; transition-duration: 1s; } .design-layout-poster:hover .image-card-wrapper { visibility: visible; opacity: 1; background-color: hsla(231, 35%, 52%, 1) } } .image-block-poster-text-alignment-left .sqs-block-image .design-layout-poster .image-card > * { text-align: center !important; } I'm trying to remove the text on mobile (it is just centered text with no hover effect on mobile). Can someone please help me write code for removing that centered text on the mobile version? Thank you!
tuanphan Posted June 10, 2022 Posted June 10, 2022 Hi, What is access password? Or try adding this to Design > Custom CSS @media screen and (max-width:767px) { .design-layout-poster .image-card * { opacity: 0 !important; } } 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
Create an account or sign in to comment
You need to be a member in order to leave a comment