jpwelchux Posted November 13, 2019 Share Posted November 13, 2019 I've applied a css shadow to all of my in-page images. However, there are a few images that I don't want to have this shadow. Is this possible, and how can I achieve? So far I've added this code to give all images shadows. .image-block-wrapper { box-shadow: -1px 2px 10px 4px rgba(0,0,0,.1); } I've been trying to target the image ID for the few images that I do not want to have a shadow: #yui_3_17_2_1_1573606191721_472{ box-shadow: none !important;} This is finicky. I can get it to work sometimes, but then upon saving the page and viewing in the browser the shadow is back. When I go back to check, it looks like the ID is different. Seems like there's not a static ID for each image. URL: https://grape-tuatara-n6mp.squarespace.com/checking-accounts P: sitehelp If you scroll down on this checking page, I'm trying to remove the shadow from the image with 3 cell phones. Side note: I also have a shadow applied to cards on my homepage. Unsure if this effects anything. .sqs-block-image .image-block-outer-wrapper.image-block-v2 { box-shadow: -1px 2px 10px 4px rgba(0,0,0,.07); } Please help! Link to comment
jpwelchux Posted November 14, 2019 Author Share Posted November 14, 2019 Any thoughts on this @tuanphan? You were a huge help on some prior questions I had. Thought it's worth a shot to ask directly. Thanks in advance! Link to comment
tuanphan Posted November 14, 2019 Share Posted November 14, 2019 1 minute ago, jpwelchux said: Any thoughts on this @tuanphan? You were a huge help on some prior questions I had. Thought it's worth a shot to ask directly. Thanks in advance! try finding & target #page-id or #block_yui 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!) Link to comment
jpwelchux Posted November 14, 2019 Author Share Posted November 14, 2019 @tuanphan thank you for the reply. I was not able to find either of the IDs you mentioned. However, I found an article : From that article I've came to some code like this: #collection-5db780f898b12c452cebb868 #content div > div > div .image-block-wrapper:nth-child(4){ box-shadow: box-shadow: -1px 2px 10px 4px rgba(0,0,0,1) ; } I was able to identify the pages #collection, but I haven't had any luck getting this to work. Any thoughts? Link to comment
tuanphan Posted November 14, 2019 Share Posted November 14, 2019 div#block-yui_3_17_2_1_1573272810320_17977 .image-block-wrapper { box-shadow: 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!) Link to comment
jpwelchux Posted November 14, 2019 Author Share Posted November 14, 2019 @tuanphan Seriously, thank you so much! You're the best 😊 Now I can see where the block-yui is so I can change the rest. Link to comment
Recommended Posts
Archived
This topic is now archived and is closed to further replies.