Css 如何在菜单中创建随文本长度展开的悬停图像？

我有一个菜单，有5项不同的文字长度-主页，关于我们，联系我们，等等 在photoshop的模型中，我为悬停状态创建了一个背景图像，但是如果它比文本长，它就会被切断，在IE中无法工作。图像是105 X 28。这里有一个链接，当你将背景图像悬停时，你会看到它。我怎样才能解决这个问题？谢谢

将css规则添加到

#main nav li a{min width:105px；}

---

我建议使用固定尺寸的ie 105px。。然后文本对齐：将每个菜单项居中，使它们整齐排列。。但这取决于你

按钮不够宽，无法容纳背景图像

---

为每个li标签指定样式

宽度：105px；高度：28px或使用该样式创建CSS类，并将该类应用于每个样式。
您可以尝试使用矩形背景图像，并使用CSS
边框半径属性来圆角

如果这不能让你得到你想要的外观或者不够兼容，通常的方法是将图像分成三部分。两端加上可以拉伸或平铺的中间部分

第三种方法是再次使用矩形背景图像，然后创建“遮罩”，这些遮罩是覆盖在主背景图像上的拐角剪切图像（与背景颜色相同），以使拐角看起来是圆形的。自从
边界半径
属性得到广泛支持以来，我就没有见过这么多这种方法。
这里是一个纯CSS解决方案


基本上使用CSS3
边界半径
和
框阴影
来代替对图像的需要。在较旧的浏览器中，这将变得不那么时髦。对于这样简单的样式，如果那些已经在网络上遭受CSS3缺乏之苦的人看不到一些非常圆滑的角落，那么它不应该成为交易的破坏者。较旧的浏览器悬停时仍会显示蓝色背景。
此外，请删除或增加
.container_12
上的宽度，否则将没有足够的空间容纳所有按钮。是否有教程向我介绍如何“将图像分成三部分。两端加上可以拉伸或平铺的中间部分。”-我不知道该怎么做css