Agency mobile menu
Back to Articles
B2B Articles
September 16, 2012
By:Ironpaper

How to use CSS drop shadows for web designers

CSS box shadow is used in casting shadows off block-level elements like <DIVS>. Both CSS rounded corners and CSS drop shadows can make website updates and maintenance  a breeze compared to cutting out images and using background elements.

Hello this is a box shadow

The structure of the above element is:

-moz-box-shadow: 3px 3px 5px 6px #ccc;

-webkit-box-shadow: 3px 3px 5px 6px #ccc;

box-shadow: 3px 3px 5px 6px #ccc;

The structure consists of:

  • horizontal offset: a positive number indicates that shadow will fall on the right of the box
  • vertical offset: a positive number indicates that the shadow will be below the box
  • blur radius: This optional attribute indicates how blurred the shadow will be
  • spread radius: Increase the size of your CSS shadow with a positive number for this attribute
  • Color: You can dictate the color of your shadow as well

Related Articles

b2b marketing
Winning the ESG Buyer: Clean Energy’s Marketing Opportunity
b2b sales
Decoding Buyer Indecision: Strategies That Drive Action
lead generation
Marketing Strategies in Healthcare Technology: Leveraging Data-Driven Campaigns to Connect and Drive Adoption
content marketing
Generative AI is Transforming the Buyer Journey in 2025
website
B2B Website Strategies for Performance in 2025
b2b
Winning the ESG Buyer: Clean Energy’s Marketing Opportunity
Interested in working for or partnering with Ironpaper? We’d love to hear from you.
We are passionate about helping remarkable companies grow. We solve challenges that hold businesses back. We love it. 
Connect with Us

Related Pages

Marketing Content Strategy ABM Strategy Lead Generation B2B Websites