a
Anonymous
a

Featured Image & Text Overlay

By Anonymous 10 months ago

Expires: Never
|
359 views
Language: CSS
Raw
.featured-image{
  position: relative;
  width:100%;
  height: 400px;
  overflow:hidden;
  background: -webkit-linear-gradient(rgba(0,0,0,0) 10%, rgba(0,0,0,0.2) 100%), url('http://www.lorempixel.com/1000/500') fixed no-repeat;
  background-size: cover;
  background-position: 50% 50%;
}

.featured-image h2{
  position: absolute;
  bottom: 5px;
  padding: 3%;
  color: #FFF;
  width:100%;
}
.featured-image{ position: relative; width:100%; height: 400px; overflow:hidden; background: -webkit-linear-gradient(rgba(0,0,0,0) 10%, rgba(0,0,0,0.2) 100%), url('http://www.lorempixel.com/1000/500') fixed no-repeat; background-size: cover; background-position: 50% 50%; } .featured-image h2{ position: absolute; bottom: 5px; padding: 3%; color: #FFF; width:100%; }