CSS 不适用于 IE 和 Firefox,但适用于 Chrome
CSS not working with IE and Firefox, but works in Chrome
站点 jgimprinters.com 在 Chrome 中加载并运行良好,但在 IE 或 Firefox 中无法正常运行。
我已验证 IE 下载样式 sheet,但它并没有应用很多样式。
例如,在 IE 中,应该以全尺寸隐藏的菜单按钮正在显示并且全部被炸毁(太大),菜单样式的 none 正在工作,一些东西的背景颜色不起作用。尽管 IE 可以看到样式sheet,但它没有应用样式。
如有任何帮助,我们将不胜感激。
谢谢
编辑:无法正常工作的片段 - 对于初学者来说,有整个导航 - header 从导航下方丢失
#nav-wrapper{
max-width:900px;
margin:0 auto;
}
#nav{
list-style:none;
}
#nav li{
float:left;
}
#nav li a{
webkit-border-radius: 6px 6px 0 0;
-moz-border-radius: 6px 6px 0 0;
border-radius: 6px 6px 0 0;
padding: 0 17px;
margin: 0 auto;
position: relative;
display: block;
height: 30px;
cursor: pointer;
text-decoration: none;
color: #FFFFFF;
line-height: 30px;
text-align: center;
font-size:12px;
font-weight:bold;
}
#nav li a.active, #nav li a.better-active{
background: #EDEDED;
color: #5D5F5D;
}
#nav li a:hover{
background:#5D5F5D;
color:#ffffff;
}
#menu-button{
display:none;
width:36px;
cursor:pointer;
}
#menu-button img{
margin:0px;
}
#head-wrapper{
height:150px;
background:url('/wp-content/uploads/2015/02/header.png') no-repeat;
background-position:center;
width:100%;
display:block;
}
#head-inner{
width:100%;
max-width:900px;
margin:0 auto;
}
#logo{
margin-left:30px;
float:left;
}
#head-right{
float:right;
width:270px;
margin-top:30px;
margin-right:15px;
}
#callout{
font-size: 14px;
font-family: Verdana, Geneva, Arial, Helvetica, Sans-Serif;
font-weight: bold;
font-style: normal;
text-decoration: none;
text-transform: none;
font-variant: normal;
text-align: left;
color: #ED1D2E !important;
width:280px;
}
#phone{
font-size: 30px;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-Serif;
font-weight: bold;
font-style: normal;
text-align: left;
vertical-align: middle;
color: #000000 !important;
text-decoration:none;
}
所有这些几乎都被 IE 和 Firefox 忽略了。
看起来像:
应该看起来像:
您的 styles.css
文件第 385 行存在语法错误,Chrome 似乎已为您修复,而其他浏览器则没有。
… url(/wp-content/uploads/2015/02/nav.png') …
有一个未打开的结束撇号。之后的所有 CSS 都不会被解析。
我是怎么知道的?
我在 my favorite editor 中打开样式表并注意到在第 385 行之后所有内容都是黄色的 — 这是字符串的颜色。
但是,验证 CSS 也会有所帮助,因为它还发现了错误(以及其他错误):
386 #main-nav Value Error : background top is not a color value ) no-repeat, …
站点 jgimprinters.com 在 Chrome 中加载并运行良好,但在 IE 或 Firefox 中无法正常运行。 我已验证 IE 下载样式 sheet,但它并没有应用很多样式。 例如,在 IE 中,应该以全尺寸隐藏的菜单按钮正在显示并且全部被炸毁(太大),菜单样式的 none 正在工作,一些东西的背景颜色不起作用。尽管 IE 可以看到样式sheet,但它没有应用样式。
如有任何帮助,我们将不胜感激。
谢谢
编辑:无法正常工作的片段 - 对于初学者来说,有整个导航 - header 从导航下方丢失
#nav-wrapper{
max-width:900px;
margin:0 auto;
}
#nav{
list-style:none;
}
#nav li{
float:left;
}
#nav li a{
webkit-border-radius: 6px 6px 0 0;
-moz-border-radius: 6px 6px 0 0;
border-radius: 6px 6px 0 0;
padding: 0 17px;
margin: 0 auto;
position: relative;
display: block;
height: 30px;
cursor: pointer;
text-decoration: none;
color: #FFFFFF;
line-height: 30px;
text-align: center;
font-size:12px;
font-weight:bold;
}
#nav li a.active, #nav li a.better-active{
background: #EDEDED;
color: #5D5F5D;
}
#nav li a:hover{
background:#5D5F5D;
color:#ffffff;
}
#menu-button{
display:none;
width:36px;
cursor:pointer;
}
#menu-button img{
margin:0px;
}
#head-wrapper{
height:150px;
background:url('/wp-content/uploads/2015/02/header.png') no-repeat;
background-position:center;
width:100%;
display:block;
}
#head-inner{
width:100%;
max-width:900px;
margin:0 auto;
}
#logo{
margin-left:30px;
float:left;
}
#head-right{
float:right;
width:270px;
margin-top:30px;
margin-right:15px;
}
#callout{
font-size: 14px;
font-family: Verdana, Geneva, Arial, Helvetica, Sans-Serif;
font-weight: bold;
font-style: normal;
text-decoration: none;
text-transform: none;
font-variant: normal;
text-align: left;
color: #ED1D2E !important;
width:280px;
}
#phone{
font-size: 30px;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-Serif;
font-weight: bold;
font-style: normal;
text-align: left;
vertical-align: middle;
color: #000000 !important;
text-decoration:none;
}
所有这些几乎都被 IE 和 Firefox 忽略了。
看起来像:
应该看起来像:
您的 styles.css
文件第 385 行存在语法错误,Chrome 似乎已为您修复,而其他浏览器则没有。
… url(/wp-content/uploads/2015/02/nav.png') …
有一个未打开的结束撇号。之后的所有 CSS 都不会被解析。
我是怎么知道的?
我在 my favorite editor 中打开样式表并注意到在第 385 行之后所有内容都是黄色的 — 这是字符串的颜色。
但是,验证 CSS 也会有所帮助,因为它还发现了错误(以及其他错误):
386 #main-nav Value Error : background top is not a color value ) no-repeat, …