Skip to content

Instantly share code, notes, and snippets.

@jasonmelgoza
Created August 7, 2012 18:39
Show Gist options
  • Select an option

  • Save jasonmelgoza/3288170 to your computer and use it in GitHub Desktop.

Select an option

Save jasonmelgoza/3288170 to your computer and use it in GitHub Desktop.
CSS3 Vignette
.img_container {
position: relative;
display: inline-block;
max-width: 900px;
-webkit-box-shadow: 0px 2px 5px rgba( 0, 0, 0, 0.4 );
-moz-box-shadow: 0px 2px 5px rgba( 0,0,0,0.4 );
-o-box-shadow: 0px 2px 5px rgba( 0,0,0,0.4 );
box-shadow: 0px 2px 5px rgba( 0, 0, 0, 0.4 );
line-height: 0;
margin-bottom: 50px;
margin-top: 50px;
}
// on the contianing div of the image
.vignette {
box-shadow: inset 0px 0px 85px rgba(0, 0, 0, .5);
-webkit-box-shadow: inset 0px 0px 85px rgba(0, 0, 0, .5);
-moz-box-shadow: inset 0px 0px 85px rgba(0,0,0,.5);
}
img.car_photo{
z-index: -1;
position: relative;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment