Для изменения ширины кнопки при наведении курсора, можно использовать CSS псевдокласс `:hover`. При этом следует задать новое значение свойства `width` внутри правила для псевдокласса `:hover`.
Пример:
```css
button {
width: 100px;
transition: width 0.3s; /* добавляем анимацию перехода */
}
button:hover {
width: 150px; /* изменяем ширину кнопки при наведении */
}
```
Чтобы соседние элементы (например, `li`) не сдвигались при изменении ширины кнопки, можно установить фиксированную ширину для родительского элемента кнопки, используя, например, свойство `flex`.
Пример:
```css
.parent {
display: flex;
}
button {
width: 100px;
}
button:hover {
width: 150px;
}
```
В данном случае родительский элемент с классом `parent` будет использовать flexbox, а кнопки будут изменять ширину при наведении курсора без влияния на соседние элементы.