CSS: выделение текста жирным шрифтом без изменения размера его контейнера

У меня есть горизонтальное меню навигации, которое в основном представляет собой

с установленными элементами бок о бок. Я не определяю ширину, а просто использую отступы, потому что я хотел бы, чтобы ширина определялась шириной пункта меню. Я выделил выделенный в данный момент элемент жирным шрифтом.

Проблема в том, что при выделении жирным шрифтом слово становится немного шире, из-за чего остальные элементы слегка смещаются влево или вправо. Есть ли хитрый способ предотвратить это? Что-то вроде указания отступу игнорировать лишнюю ширину, вызванную полужирным шрифтом? Моя первая мысль заключалась в том, чтобы просто вычесть несколько пикселей из заполнения «активного» элемента, но это количество варьируется.

Если возможно, я бы хотел избежать установки статической ширины для каждой записи с последующим центрированием в отличие от решение для заполнения, которое у меня есть в настоящее время, чтобы упростить будущие изменения записей.