Advanced Search

Shadow Box Effect

/ Published in: CSS
Save to your folder(s)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. 1) Add this part to your blog posts or pages in order to create a new shadow-box area:
  2.  
  3. <div id="shadow-box">
  4. Put your text here!
  5. </div>
  6.  
  7. 2) Add this to your CSS style sheet for the theme you are using. 
  8. For example, if you are using LabHeadlines it would be the custom.css style sheet.
  9.  
  10. #shadow-box {
  11. -moz-box-shadow:5px 5px 5px #666666; 
  12. -webit-box-shadow:5px 5px 5px #666666;
  13. background:none repeat scroll 0 0 #CCCCCC;
  14. height:auto;
  15. margin:15px 0;
  16. width:400px;
  17. color:#ffffff;
  18. font-size:24px;
  19. text-align:center;
  20. padding:30px;
  21. }

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.