Question

http://www.sc.x10.bz/test/awesome-menu.html

CSS

* { margin: 0; padding: 0; } /* Reset stuff */
ul#subheader {

width: 920px; 
margin: 250px auto; 
list-style: none;
}

ul#subheader li { 
display: inline; 
}

ul#subheader li a {

display: block; 
float: left; 
height: 45px;

background-image: url(images/subheader.png); 
text-indent: -9999px;
}


ul#subheader li a.who {
        width: 306px; background-position: 0 0; 
    }

ul#subheader li a.what {
        width: 306px; background-position: -306px 0;    
    }

ul#subheader li a.why {
        width: 306px; background-position: -612px 0;    
    }


a { outline: none; }

`

这很好......

但是一旦我移动这个菜单，在我的实际索引页面内..它没有正确显示.. 看看这里： http://www.simplecreations.co.uk/

请帮助

Answer 1

检查您的CSS是否有错误。

div#header {
width:100%;
height:auto;
margin:0px auto;
text-align:center;
text-align: center;
background: url(images/header2.png) no-repeat;
background-position: left;

/* subheader */
{ margin: 0; padding: 0; } /* Reset stuff */

标题CSS没有结束括号。

subheader css没有选择器

Answer 2

您忘记关闭CSS中标识为标题的div

Answer 3

变化：

div#header {
    width:100%;
    height:auto;
    margin:0px auto;
    text-align:center;
    text-align: center;
    background: url(images/header2.png) no-repeat;
    background-position: left;

要：

div#header {
    width:100%;
    height:auto;
    margin:0px auto;
    text-align:center;
    text-align: center;
    background: url(images/header2.png) no-repeat;
    background-position: left;
}

此外，您可能希望从CSS脚本中删除HTML / XML（＆lt;！ - - ＆gt;）注释标记。

<ul> <li> div内的标签？在IE浏览器中工作正常但在Firefox / chrome </li> </ul>中没有

3 个答案: