Меню ломается, когда не должно

Question

На этот вопрос мне не ответили: /

// Hello there

Answer 1

Это определенно странно в коде. Я добился того, чтобы он выглядел правильно в коде, настроив параметры перехода и преобразования:

header div div#menu_btn .menu_cont span {
  overflow: visible;
  position: absolute;
  left: 0;
  transition: transform 250ms ease-out; /* transform instead of all */
  display: block;
  height: 3px;
  width: 25px;
  background-color: black;
  /*  transform-origin: right center; */
}

header div div#menu_btn .menu_cont span.one.transition {
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
  top: 6px; /* changed */
}
header div div#menu_btn .menu_cont span.two.transition {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  bottom: 5px; /* changed */
}