JSFiddle - React, Tailwind, and code Playground

by Jaak Kütt

HTML

<div class="pressListItem">


      <img src="" width="" height="">


     <h3>July 2013</h3>


    </div>


    <div class="pressItemHover">

     <p>This is come more content, lalala here is a little snippet</p>

     <span></span>

     <span>Read more</span>
    </div>

CSS

.pressItemHover{
    opacity: 0;
    transition: opacity 0.5s linear 0s;
    display: none; 
}

.pressListItem:hover .pressItemHover{
    opacity: 1;
    display: block;
}

.pressListItem{
    width: 200px;
    float: left;
    height: 200px;
    margin-right:12px;
    text-align: center;
    border: solid 1px #e4e4e4;


}