JSFiddle - React, Tailwind, and code Playground

HTML

<div id="attach-wrap">
        <div id="attach">

            ... content ...

        </div>
    </div>

CSS

#attach { 
  height: 50px;
  width: 82px;
  margin: 0 auto;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  -webkit-transition: height 0.35s ease, width 0.35s ease;
  -moz-transition: height 0.35s ease, width 0.35s ease;
  -ms-transition: height 0.35s ease, width 0.35s ease;
  -o-transition: height 0.35s ease, width 0.35s ease;
  transition: height 0.35s ease, width 0.35s ease;
  text-align: center;
}

#attach:hover { 
  height: 50px; 
  width: 100px;
  border-bottom: 1px solid #000;
  background-color: rgba(250,250,250,1);
  z-index: 100;
  top: 0;left:0;
  margin: auto;
}

JavaScript

jQuery('body').click(function(){$('#attach').toggleClass('stick')});