'Stuck at spacing stick evenly in a dynamic hamburger menu in react using tailwind

Here's my codesandbox.

I used this as the source code and converted it to react.

As you can see, I'm trying to create a dynamic hamburger menu that can get two props:

  • containerStyle
  • stickStyle

And the behavior should be the same for all of them, including transition and duration.

I'm stuck at spacing sticks inside the parent. If I remove the absolute positioning for sticks, they won't align. And when I use the absolute I don't know how to evenly space them.

cssreactjstailwind-css


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source

Related Questions