2013-07-07 35 views
0

当你的Google像“IE独立样式表”这样的东西时,有很多阅读材料,但没有很多例子。IE有条件的样式表不起作用

我对IE7有以下条件CSS,就在我的主要样式之后。

我希望margin-top在IE7中更大。

<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo('stylesheet_url'); ?>" /> 
<!--[if IE 7]> 
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/ie7.css" media="screen" type="text/css" /> 
<![endif]--> 
<!--[if IE 8]> 
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/ie8.css" media="screen" type="text/css" /> 
<![endif]--> 

在我的主要样式表我有这样的:

.outerBlue_s { 
    width: 230px; 
    height: 260px; 
    overflow: hidden; 
    color: #FFF; 
    border-radius: 10px; 
    box-shadow: 5px 5px 2px #cccccc; 
    -moz-box-shadow: 5px 5px 2px #cccccc; 
    -webkit-box-shadow: 5px 5px 2px #cccccc; 
    margin:0 auto; 
    text-align:center; 
    font-size:18px; 
    vertical-align:middle; 

在IE浏览器的样式表,我只把所需保证金:

.outerBlue_s { 
    margin-top:50px; 
} 

尽管这样,保证金没有改变当我检查IE7。

任何帮助和建议表示赞赏。

<link rel="stylesheet" type="text/css" media="all" href="http://fafaradesigns.com/wp/wp-content/themes/fafaradesigns/style.css" /> 
<!--[if IE 7]> 
<link rel="stylesheet" href="http://fafaradesigns.com/wp/wp-content/themes/fafaradesigns/ie7.css" media="screen" type="text/css" /> 
<![endif]--> 
<!--[if IE 8]> 
<link rel="stylesheet" href="http://fafaradesigns.com/wp/wp-content/themes/fafaradesigns/ie8.css" media="screen" type="text/css" /> 
<![endif]--> 

它看起来不像ie7表格被引用。我究竟做错了什么?

彼时我通过把条件样式内嵌每一个人页面上有一个黑客会:

<!--[if lt IE 8]> 
<style> 
.innerBlue_c { 
margin-top: 1.5em; 
} 
</style> 

我宁愿去与外界分开,即样式表使代码更干净 - 但我不能弄清楚它为什么不起作用。条件陈述看起来错了吗?

+1

当你查看源文件,进行实际的样式表的位置来了吗?对于这个问题,你可以把结果HTML放在这里,而不是PHP? –

+0

我无法理解为什么你会希望一个特定的浏览器与其他浏览器有不同的利润率,但我相信你有你的理由。 –

+0

我使用了一个css技巧,我跑过去垂直对齐使用display:table,但不幸的是ie7不会这样做。这是我希望ie7 margin与其他浏览器不同的唯一原因。 –

回答

0

更新:我终于得到外部样式表加载使用Monderizr和我最初列出的相同的条件代码。似乎我所要做的只是在外部工作表中的样式前添加一个.ie7。

是:工作的代码示例:

.ie7 #nav li { 
    z-index: 102; 
}