导航项由于未知原因闪烁

Question

我创建了一个带有动画悬停效果的导航菜单，该菜单在悬停的项目下创建了一个移动的下划线。但是，当我将鼠标悬停在某个项目上时，菜单“闪烁”的其他项目好像它们稍微移开了位置然后又回来一样。我不知道为什么会这样：这是我的代码：

import json

with open('output.json', encoding='utf-8') as json_file:  
    output = json.loads(json_file.read())
feeds = []
for feed in output ['posts'][:10]: #   <---- Change on this line
    feeds.append (feed)
print (feeds[1]['title'])

当然，这只是代码的一部分，如果您想了解更多内容，请告诉我哪一部分。我只是不想淹没。

HTML代码：

nav a::before {
content: ' ';
display: block;
height: 3px;
background-color: #fff;
position: absolute;
bottom: -.5rem;
left: 0;
right: 0;
transform: scale(0, 1);
transition: transform ease-in-out 200ms;
}
nav a:hover::before {
transform: scale(1,1);
}

非常感谢， 厄默尔