2013-05-17 2 views
0

Ниже мой HTML кодцвет фона не работает в IE7

<UL> 
    <LI> 
    <LI> 
    .. 
    <LI> 
    <a class="upload_menu" href="someLink" ><span>Your Recipes</span></a> 
    </LI> 
    <LI> 
</UL> 

Ниже класс CSS

.ie7 #navigation .upload_menu { 
    background-color: #bb3f3f; 
    color: #FFF; 
    float: left; 
    font-size: 12px; 
    font-weight: bold; 
     padding: 9px 4px 10px 6px; 
    text-decoration: none; 
     !background: url(../../../static-files/images/common/nav-divider.gif) no-repeat right; 
     border-right: 1px solid #BCDAEE; 

} 


.ie7 #navigation .upload_menu:hover { 
background-color: #bb3f3f; 
} 

дал также попробовать на ниже CSS

*:first-child +html #navigation .upload_menu { 
    background-color: #bb3f3f; 
    color: #FFF; 
    float: left; 
    font-size: 12px; 
    font-weight: bold; 
     padding: 9px 4px 10px 6px; 
    text-decoration: none; 
     !background: url(../../../static-files/images/common/nav-divider.gif) no-repeat right; 
     border-right: 1px solid #BCDAEE; 

} 

*:first-child +html #navigation .upload_menu:hover { 
background-color: #bb3f3f; 
} 

Но background-color attrtibute сам по себе не воспринимается, как видно из инструмента разработчика.

DeveloperTool Tab

+0

IE-7? ? _Really? _ –

+0

@Dhaval: почему бы и нет? Многие люди (к сожалению, я признаю) все еще используют его. –

+0

Я .. почему что случилось? –

ответ

1

Я думаю, что проблема здесь является Hacky:

!background: url(../../../static-files/images/common/nav-divider.gif) no-repeat right; 

Это, как представляется, подменяют background-color атрибут (идя по background-image собственности в списке "Current Style") - если вы не дадите ему background-image в другом месте - если это так, что код не был предоставлен.

Что вы можете сделать, это добавить цвета к этой декларации:

!background:#bb3f3f url(../../../static-files/images/common/nav-divider.gif) no-repeat right; 

Или же разделить эти фоновые части из немного, чтобы предотвратить его переопределение background-color атрибута:

!background-image:url(../../../static-files/images/common/nav-divider.gif); 
!background-repeat:no-repeat; 
!background-position-x:right; 
Смежные вопросы