Save 25% on Wizard’s SQL for WP w/ code: WIZARDSQL
Web Dev + WordPress + Security

CSS3 Tip: Removing Box Shadows

Adding box shadows is a great way to bring depth and focus to your design. You have probably seen this trick before:

.selector {
	-webkit-box-shadow: 0 3px 5px #333;
	-moz-box-shadow: 0 3px 5px #333;
	box-shadow: 0 3px 5px #333;
	}

That CSS snippet will add a nice drop shadow to any matching selector. But what if you want to remove the box shadow from one or more of the matched elements? Easy, just declare none for any box-shadow property values:

.selector.noshadow {
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	}

Depending on the cascade, you may need to strengthen the .selector with greater specificity. Here we disable the box-shadow from all elements classed with .noshadow. So something like this:

<div class="selector">This box has a shadow</div>
<div class="selector noshadow">This box has no shadow</div>
<div class="selector">This box has a shadow</div>
Jeff Starr
About the Author
Jeff Starr = Designer. Developer. Producer. Writer. Editor. Etc.
Wizard’s SQL for WordPress: Over 300+ recipes! Check the Demo »
Welcome
Perishable Press is operated by Jeff Starr, a professional web developer and book author with two decades of experience. Here you will find posts about web development, WordPress, security, and more »
.htaccess made easy: Improve site performance and security.
Thoughts
The Legend of Zelda: Tears of the Kingdom coming May 12, 2023. Absolutely pumped.
Favorite thing for breakfast is a tall glass of cold water. Hits the spot every time.
Fall is my favorite season :)
Still a few days left before “Unlimited” pro licenses are no longer available.
Getting back into it after a nice mini vacation. Time to ramp up and get busy.
Enjoy my 7-year hand-curated collection of free online tools for web dev and design.
Weapons required to rule the world: the weather, common cold, plenty of idiots.
Newsletter
Get news, updates, deals & tips via email.
Email kept private. Easy unsubscribe anytime.