IE 6~8忽略边栏上的字体、背景和页边距

时间：2013-03-05 作者：kwela12

我在我的网站上使用默认的212WordPress主题，并试图自定义侧栏。我使用的CSS是：

.widget-area, #secondary{
float: right;
width: 210px;
font-family: Georgia, "Times New Roman", Times, serif;
padding: 0 15px 0 15px;
border-bottom: 1px solid #cacaca;           
border-top: 1px solid #cacaca;
background-color: #efefef;
margin-top: 45px; }
侧边栏的代码与默认模板保持不变，我正在使用文本小部件作为侧边栏的内容。问题页面如下：

http://www.discusscps.com/gccenter/about-our-organization/

Chrome、Safari和IE 9没有问题，但在IE 6～8中，字体系列、边框、背景色和上边距被忽略。

我已经尝试了这里我能想到的一切——任何想法都将不胜感激。非常感谢。

2 个回复
最合适的回答,由SO网友:Vinod Dalvi 整理而成

您已在css3媒体查询下方添加了此CSS，而此css3媒体规则不支持IE8及以下浏览器，因此它不应用其块中包含的CSS。

/* Minimum width of 600 pixels. */
@media screen and (min-width: 800px) { 
.widget-area, #secondary{
float: right;
width: 210px;
font-family: Georgia, "Times New Roman", Times, serif;
padding: 0 15px 0 15px;
border-bottom: 1px solid #cacaca;           
border-top: 1px solid #cacaca;
background-color: #efefef;
margin-top: 45px; }
}
要使其工作，只需在该媒体查询块之外声明此css规则，如下所示。

/* Minimum width of 600 pixels. */
@media screen and (min-width: 800px) { 

}
.widget-area, #secondary{
float: right;
width: 210px;
font-family: Georgia, "Times New Roman", Times, serif;
padding: 0 15px 0 15px;
border-bottom: 1px solid #cacaca;           
border-top: 1px solid #cacaca;
background-color: #efefef;
margin-top: 45px; }

SO网友:Ronald

是否使用重置。css？如果没有，您可以在此处下载http://www.cssreset.com/scripts/html5-doctor-css-reset-stylesheet/

也可以使用IE条件注释

<!--[if IE 8]> = IE8
<!--[if lt IE 8]> = IE7 or below
<!--[if gte IE 8]> = greater than or equal to IE8
Usages

<!--[if IE 8]>

<style type="text/css"> /* css for IE 8 */</style>

<![endif]-->

<!--[if lt IE 8]>

<link href="ie7.css" rel="stylesheet" type="text/css" />

<![endif]-->

有关IE黑客的更多信息，请访问此处http://webdesignerwall.com/tutorials/css-specific-for-internet-explorer

结束
标签： css   sidebar   browser-compatibility   小码农  

相关推荐

将esc_html与HTML净化器和CSSTidy一起使用：过度杀伤力？

目前，Wordpress主题选项面板中的我的文本区域输入（接受用户自定义CSS输入）由Wordpress中的esc\\u html函数进行清理http://codex.wordpress.org/Function_Reference/esc_html然而，我正在考虑一种安全的方法，因此我想添加HTML净化器和CSSTidy，如下图所示：https://stackoverflow.com/questions/3241616/sanitize-user-defined-css-in-php这有必要吗？或者像e

IE 6~8忽略边栏上的字体、背景和页边距 - 小码农CODE - 行之有效找到问题解决它

IE 6~8忽略边栏上的字体、背景和页边距

时间：2013-03-05 作者：kwela12

我在我的网站上使用默认的212WordPress主题，并试图自定义侧栏。我使用的CSS是：

.widget-area, #secondary{
float: right;
width: 210px;
font-family: Georgia, "Times New Roman", Times, serif;
padding: 0 15px 0 15px;
border-bottom: 1px solid #cacaca;           
border-top: 1px solid #cacaca;
background-color: #efefef;
margin-top: 45px; }
侧边栏的代码与默认模板保持不变，我正在使用文本小部件作为侧边栏的内容。问题页面如下：

http://www.discusscps.com/gccenter/about-our-organization/

Chrome、Safari和IE 9没有问题，但在IE 6～8中，字体系列、边框、背景色和上边距被忽略。

我已经尝试了这里我能想到的一切——任何想法都将不胜感激。非常感谢。

2 个回复
最合适的回答,由SO网友:Vinod Dalvi 整理而成

您已在css3媒体查询下方添加了此CSS，而此css3媒体规则不支持IE8及以下浏览器，因此它不应用其块中包含的CSS。

/* Minimum width of 600 pixels. */
@media screen and (min-width: 800px) { 
.widget-area, #secondary{
float: right;
width: 210px;
font-family: Georgia, "Times New Roman", Times, serif;
padding: 0 15px 0 15px;
border-bottom: 1px solid #cacaca;           
border-top: 1px solid #cacaca;
background-color: #efefef;
margin-top: 45px; }
}
要使其工作，只需在该媒体查询块之外声明此css规则，如下所示。

/* Minimum width of 600 pixels. */
@media screen and (min-width: 800px) { 

}
.widget-area, #secondary{
float: right;
width: 210px;
font-family: Georgia, "Times New Roman", Times, serif;
padding: 0 15px 0 15px;
border-bottom: 1px solid #cacaca;           
border-top: 1px solid #cacaca;
background-color: #efefef;
margin-top: 45px; }

SO网友:Ronald

是否使用重置。css？如果没有，您可以在此处下载http://www.cssreset.com/scripts/html5-doctor-css-reset-stylesheet/

也可以使用IE条件注释

<!--[if IE 8]> = IE8
<!--[if lt IE 8]> = IE7 or below
<!--[if gte IE 8]> = greater than or equal to IE8
Usages

<!--[if IE 8]>

<style type="text/css"> /* css for IE 8 */</style>

<![endif]-->

<!--[if lt IE 8]>

<link href="ie7.css" rel="stylesheet" type="text/css" />

<![endif]-->

有关IE黑客的更多信息，请访问此处http://webdesignerwall.com/tutorials/css-specific-for-internet-explorer

标签： css   sidebar   browser-compatibility   小码农  

相关推荐

在带有PHP的子主题中包含style.css

在里面https://codex.wordpress.org/Child_Themes 这是包含样式的最佳实践。css在子主题中，必须将下面的代码放入函数中。php的子主题，但将“父样式”替换为可以在函数中找到的父主题的参数。父主题的php。我在我的主题文件中找不到它，那里也没有多少代码。使用@import包含父主题样式表的方法不适用于我，放入文件的css不会在任何浏览器的站点上显示自己。function my_theme_enqueue_styles() { $parent_s