CodePen

HTML

            
              <div class="container">
  <div class="image"></div>
  <div class="info"></div>
  
  <div class="image"></div>
  <div class="info"></div>
  

  
  
</div>
            
          
!

↑ Insert the most common viewport meta tag

CSS

            
              .container {
  width:50%;
  height:250px;
  background:#242424;
  margin:0 auto;
  
  position:relative;
}

.image {
  width:200px;
  height:200px;
  
  background:red;
  margin:25px 7px;
  
  float:left;
}

.info {
  background:blue;
  width: 200px;
  height:200px;
  margin:25px 7px;
  
  display:none;
}

.container .image:hover + .info {
  float:left;
  display:block;
}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................