Advanced Search

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

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

Expand | Embed | Plain Text

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.