部署导航菜单 - 背景的CSS麻烦

Live site.部署导航菜单 - 背景的CSS麻烦

我有一个部署导航菜单，其中（理想情况下），第一组按钮的应在任一侧上具有的#00010420px。在“关于”和“属性”上方悬停后，展开会继续执行#000104后面的扩展选项。

虽然限制第一组按钮的大小有困难。做这个的最好方式是什么？（我的主要问题是每个按钮是一个不同的长度 - 关于，博客，联系方式，属性，如何动态地大小的背景颜色？）

jsfiddle.

ideal image

来源

2013-02-17 AMC

你是什么意思是什么呢？ “限制第一组按钮的大小”或“确定背景颜色的大小”是什么意思？请解释更多 – Roy 2013-02-17 21:52:14

@罗伊我会附上一张图片来展示我的意思。谢谢。 – AMC 2013-02-17 21:56:42

你想用background: #000104上a标签，而不是ul标签。这样，颜色不会扩展到无序列表的整个宽度;它只会延伸到a文本。此外，为了让按钮在每一侧都伸出更多，请在左侧和右侧添加20px的padding。

nav ul li a { 
    background: #000104; 
    padding-left: 20px; 
    padding-right: 20px; 
}

JS Fiddle Example

来源

2013-02-17 21:59:43 JSW189

感谢您对此问题的帮助。它与我正在寻找的东西非常接近，但是现在，当我将鼠标悬停在“关于”上时，例如，随着部署选项的扩展，“关于”一词消失。我该如何纠正这一点？例如，请参阅更新的jsfiddle。 http://jsfiddle.net/498qm/2/ – AMC 2013-02-17 22:13:18

没问题！只需在您的展示菜单中将“padding-left”更改为“margin-left”即可。他们的背景是覆盖“关于”和其他菜单项。 [见这更新的JS小提琴]（http://jsfiddle.net/498qm/3/）。 – JSW189 2013-02-17 22:16:27

完美，谢谢！ – AMC 2013-02-17 22:22:10

部署导航菜单 - 背景的CSS麻烦

回答

相关问题