Jump to content

How to add a drop shadow to a text box?

Go to solution Solved by Ziggy,

Recommended Posts

I have created text with a white background, but wanted a black drop shadow to appear behind this. (not on the text inside the background colour). (please see visual-ess.com for an example of what i want it to look like, and image attached. I have attached image of what I can get it to look like). I would like it for different headings throughout the website (not an image block). 

I have found codes for image block drop shadow, but can't seem to find one for text with background. 

 

Thank you

 

 

Screenshot 2023-08-26 at 16.29.11.png

Screenshot 2023-08-26 at 16.29.43.png

Link to comment

A good way is with code, but you'll need to find and add a block ID to CSS for each one that you want to add. If you can share your website URL site wide password and this page I can get you started.

Edited by Ziggy

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment
  • Solution

You can use this as a starting point, add as many block IDs separated by commas as I've done for the first two:

#block-yui_3_17_2_1_1693005786856_33331, #block-yui_3_17_2_1_1693005463940_31073  {
  box-shadow:12px 12px #000000;
}

Let me know if that helps!

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.