A Pen by Secret Sam.

CSS3-hover-text-animate-in-div.markdown

CSS3 hover text animate in div

Forked from Richard Bray's Pen CSS3 hover text animate in div.

A Pen by Anonasaurus Rex on CodePen.

License.

index.html

<div class="blue-btn">
  <a class="first-link" href="">
    First Text
  </a>
  <a href="">
    Second Text
  </a>
</div>

style.css

.blue-btn a{
  color: white;
  text-decoration:none;
  text-align: center;
  display:inline-block; /* important */
}

.blue-btn, .first-link{
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;     
}


.blue-btn{
  height: 64px;
  font: normal normal 700 1em/4em Arial,sans-serif;
  overflow: hidden;
  width: 100px;
  background-color: #3b5998;
}


.first-link{
  margin-left: 12px;   
}

.blue-btn:hover .first-link{
  margin-left: 90px;
}