JSFiddle - React, Tailwind, and code Playground

HTML

<div>
  text1
  <span><a href="#">link1</a></span>
</div>
<div>
  text2
  <span><a href="#">link2</a></span>
</div>

CSS

div{
  display:inline-block;
  overflow:hidden;
  min-height:10px;
}
span{
  display:inline-block;
  position:relative;
  top:100px;
  transition: top .1s ease-out .1s;
}
div:hover span{
  top:0;
  transition: top .1s ease-out .1s;
}