Stwosch Stwosch - 1 year ago 69
Sass (Sass) Question

hamburger menu position of span's in animate

I want to make hamburger menu icon and my problem is I want animate middle span to right side, I don't know how to do it.


<div class="container">


.container {
right: 15%;
top: 10%;

span {
display: block;
border: 3px solid black;
margin: 5px 0;
width: 40px;

.container:hover span:nth-child(2) {
animation: animation 1s forwards;

@keyframes animation {
to { width: 20px; }

Example :

Answer Source

You can do

@keyframes animation {
  to { 
    width: 20px; 
    margin-left: 20px;


Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download