CSS - 流体布局和居中的无表格菜单栏

Question

我正在尝试使用一些带有透明胶片的 png 图像制作一个无表格的菜单栏。 菜单栏嵌套在具有最小/最大宽度的包装器内，并使用自动左/右边距居中。 理想情况下，我希望 1 部分使用背景重复 x 来调整自身长度。 由于 png 具有透明度值，因此它们不能相互重叠，因为这会增加重叠部分的可见性。

我尝试了绝对定位，但这会迫使你有一个水平的起始位置，这在流体布局中是不可用的。 包装样式：

margin-left: auto; 
margin-right: auto; 
min-width: 960px; 
max-width: 1260px; 
padding: 0px 20px 0px 20px; 
overflow: visible;

带表的工作设计： http://jsfiddle.net/f35UK/

图片（我在代码中使用了 base64 但以防万一）：

• http://imgur.com/REQ2E.png主要精灵
• http://i.imgur.com/Mnp0q.png
• http://imgur.com/Mnp0q.png

Answer 1

为您的菜单使用列表项。 有关如何设置的示例，您可以查看我正在处理的项目：

http://basenharald.nl/3d/在下面的“navigatie”源搜索中，您将找到 UL 导航

还在源搜索“#nav”中打开http://basenharald.nl/3d/css/style.ZC7A62 8CBA22E28EB17B5F5C6AE2A266AZ。 这是用于设置导航的 css 部件。