Небольшое изменение позиции при наведении курсора в CSS ⇐ CSS

[Anonymous]

Это мой первый вопрос, поэтому извините, если я спрашиваю нечетко.
Я работаю с HTML и CSS и не знаю, почему, когда я устанавливаю наведите указатель мыши на элемент div, чтобы создать рамку вокруг него, граница появляется, но элемент смещается немного вниз, и это моя проблема. У кого-нибудь еще есть такое?
Я поставлю фото CSS-кода и буду рад, если вы мне поможете, спасибо.

Код: Выделить всё

`.navbar{
height: 48.48px;
width: 70px;
float: right;
margin: 10px 5.57%;
color: white;
text-align: center;
cursor: pointer;
box-sizing: border-box;
}
.text1{
color: white;
cursor: pointer;
}
.navbar :hover{
border: 1.5px white solid;
border-radius: 10px;
}

Я пытался сделать рамку вокруг элемента div, когда на нем находится курсор при наведении курсора, хотя граница появляется, элемент div немного перемещается.
Я даже пробовал размер коробки, но не помогло


Подробнее здесь: https://stackoverflow.com/questions/788 ... ver-in-css