play button

CSS play button after hover

by levan gongadze

HTML

<div class="article">
  <div class="play">
  play
  </div>
</div>

CSS

.article {
  background: #000;
  width: 300px;
  height: 300px;
  position: relative;
}

.play {
  display: none;
	position: absolute;
	top: 50%;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%,-50%);
  background: #fff;
}

.article:hover .play {
  display: block;
}