Div Hover Content

Show a hidden div with content on hover with pure CSS.

by japaneselanguagefriend

HTML

<div class="divone">
    <div class="divtwo">some text here</div>
    <img src="//placehold.it/223x169" />
</div>

CSS

.divone {
    width:223px;
    height:169px;
    position:relative;
}
.divtwo {
    background-color:red;
    top:120px;
    height:50px;
    width:223px;
    position:absolute;
    visibility:hidden;
}
.divone:hover .divtwo {
    visibility:visible;
}