Helping fixing menu bar spazzing out when resizing?

https://hastebin.com/share/guyotiwutu.xml As the pastebin shows, when the menu expands it does some weird movement. This website was only an example so I can stop this issue in the future. Thanks in advance
Hastebin
Hastebin is a free web-based pastebin service for storing and sharing text and code snippets with anyone. Get started now.
8 Replies
Jochem
Jochem•11mo ago
if you use something made to share code rather than text, like codepen, people can much more easily see what you're talking about: https://codepen.io/jochemm/pen/poQxOPW
Jochem
Jochem•11mo ago
it seems to work just fine for me though, both in chrome and firefox
Charlie Boi
Charlie Boi•11mo ago
There is icons from boxicons which is the stylesheet referenced in the <head> Using then has a habit of shaking
Jochem
Jochem•11mo ago
I've updated the pen to include that one, I'll see if I can take a look, otherwise I'm sure someone else will be along 🙂
Charlie Boi
Charlie Boi•11mo ago
Thanks, It's the "opening" of the navBar that is annoying
Jochem
Jochem•11mo ago
it's the positioning on the h3 that's causing the problem, you're unsetting the position which instantly moves the icon back to where it would be without the absolute positioning I've updated the pen with the absolute positioning removed, and a padding added to the i to give it the right position when the menu is closed you may still have to do some tweaking to the .navBar:hover version of i though
Charlie Boi
Charlie Boi•11mo ago
That's so much better now, I tried the same thing yet I got a much worse result Neat Thanks
Jochem
Jochem•11mo ago
glad to help!