CSS：粗体显示一些文本，而不更改容器的大小 [英] CSS: bolding some text without changing its container's size
问题描述
我有一个水平导航菜单，它基本上只是一个< ul> ，元素并排设置。我不定义宽度，而只是使用填充，因为我想要的宽度由菜单项的宽度定义。
I have a horizontal navigation menu, which is basically just a <ul> with the elements set side-by-side. I do not define width, but simply use padding, because I would like the widths to be defined by the width of the menu item. I bold the currently-selected item.
麻烦的是，在粗体中，单词变得稍宽，这导致其余的元素略微向左移动，对。有没有聪明的方法来防止这种情况发生？沿着告诉padding忽略由粗体造成的额外宽度的线的东西？我的第一个想法是简单地从活动元素的填充减去几个像素，但这个量变化。
The trouble is that in bolding, the word becomes slightly wider, which causes the rest of the elements to shift slightly to the left or right. Is there a clever way to prevent this from happening? Something along the lines of telling the padding to ignore the extra width caused by the bolding? My first thought was to simply subtract a few pixels from the padding of the "active" element, but this amount varies.
如果可能，我想避免设置静态宽度在每个条目，然后居中，而不是我目前拥有的填充解决方案，以便使未来更改条目简单。
If possible I'd like to avoid setting a static width on each entry and then centering as opposed to the padding solution I currently have, in order to make future changes to the entries simple.
编辑： / b>一张图片值得一千个选择不当的字词：
a picture's worth a thousand poorly chosen words:
推荐答案
我有同样的问题，但得到了一个类似的效果与一个妥协，我使用文本阴影代替。
I had the same problem, but got a similar effect with a little compromise, I used text-shadow instead.
li:hover {text-shadow:0px 0px 1px black;}
这篇关于CSS：粗体显示一些文本，而不更改容器的大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
