#help, "box-sizing:border-box" does not work

Question

I'm try to add white border to hover menu. When i hover the menu, height and width is increases. I try to add "box-sizing: border-box;" but doesn't work.

this is my code: https://code.sololearn.com/WlvdMVG0EeeL

is there something wrong with my code?

Answer 1

.main-nav a{
color: #fff;
display: block;
padding: 10px 20px;
box-sizing: border-box;
text-decoration: none;
border : 2px solid #000529;
}
This does the trick for the output.
Simply add a border property to .main-nav a

Answer 2

Ehhhhhhh hehehhe its work. I will remember that trick :D

Thank you @vedant Bang

Answer 3

You're welcome :)