Respektīvi gribu ko šādu : https://codepen.io/philcheng/pen/YWyYwG
Tikai nevis kad pele hovero bildi, bet gan visu div class laukumu. Ņēmu kodu no šī paša saita, centos pielāgot. Viss baigi izplūst no rāmjiem...

HTML

<div id="body">            
<div id="content">
          <div class="box">
              <div class="blog-content">
                  <h1>test123</h1>
                  <p>AAAAAAASDSDAGSDGFDSG</p>
              </div>
          </div>
      </div>


CSS

.blog-content {
    display:block;
    opacity:1;
    float:left;
    overflow:hidden;
   width:640px;
   height:271px;
    margin-top:5px;
    padding:5px;
    border:solid 1px;
    transition: .5s ease;
    backface-visibility: hidden;
}

.blog-content img{
    float:left;
}
.blog-content img a:hover{
    opacity:0.5;
}

.blog-content h1,h2,h3 {
    text-align:center;
    padding-top:10px;
}

.blog-content p{
    float:left;
    margin:10px;
}

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: auto;
    height: auto;
    background: rgba(0, 0, 0, 0);
    transition: background 0.5s ease;
}

.blog-content:hover .overlay {
    display: block;
    background: rgba(0, 0, 0, .3);
}
.button {
    position: absolute;
    width: 500px;
    left:0;
    top: 180px;
    text-align: center;
    opacity: 0;
    transition: opacity .35s ease;
}

.button a{
    width: 200px;
    padding: 12px 48px;
    text-align: center;
    color: white;
    border: solid 2px white;
    z-index: 1;
}

.blog-content:hover .button {
    opacity:1;