如何在HTML/CSS中创建菜单背景，即使标题也是如此

问题：即使带有标题，也无法生成菜单背景。（您将在图片中看到）

如何切断它们

CSS代码：

.header {
    margin:0px auto;
    max-width: 960px;
}

#header {
    height:300px;
    width:960px;
    background-image:url("img/top.png")
}
#menu ul {
    margin:0px auto;
    margin-left:-59px;
    list-style: none;
    background:#3d3d5c;
}

#menu li {
    display: inline-block;
}

#menu li a  {
    color:#fff; 
    text-decoration:none; 
    display:block; 
    background:url(img/manu.png); 
    padding:0 10px 0 10px;  
    height:54px; 
    width:130px;
    line-height:54px;
}

#menu li a:hover {
    color:#fff; 
    text-decoration: none; 
    background:url(img/manu1.png);  
    height:54px; 
    width:130px;
    line-height:54px;
}

---

下面是JSFIDLE:

下面的更新将会解决您的问题：

#menu ul {
    margin:0px auto;
    margin-left:-20px; /*pull towards left*/
    margin-right:20px; /*push towards right*/
    list-style: none;
    background:#3d3d5c;
}

---

这些修改应该可以解决这个问题

.header {
    margin: 0px auto;
    padding: 0px;
    width: 960px;
}

并从

ul

#menu ul {
    margin: 0px auto;
    list-style: none;
    background: #3d3d5c;
}