An inside border with opacity on a div with a background image


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



Copy this code and paste it in your HTML
  1. HTML:
  2.  
  3. <div class="theme_border"></div><div class="theme_example"></div>
  4.  
  5. CSS:
  6.  
  7. .theme_example {
  8. width:280px;
  9. height:180px;
  10. background-image:url('image.png');
  11. background-repeat:no-repeat;
  12. }
  13.  
  14. .theme_border {
  15. width:250px;
  16. height:150px;
  17. border:15px solid #fff; /* rgba(255, 255, 255, 0.1) */
  18. position:absolute;
  19. z-index:1;
  20. opacity:0.1;filter:alpha(opacity=10);
  21.  
  22. }

URL: http://forrst.com/posts/filtered/code

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.