Нужна помощь в устранении проблемы css в IE8? - PullRequest
Новая
       25

Нужна помощь в устранении проблемы css в IE8?

0 голосов
/ 20 апреля 2011

Привет, ребята. У меня возникли проблемы с кросс-браузерной работой с моими таблицами стилей, а именно: 8.

Приведенный ниже css отлично работает в моей таблице стилей chrome / ff, но совсем не работает для моей, т.е.

#threetwoBTN {
background-repeat: no-repeat;
background-image: url('../images/32Button_BG01.png');
}
a#threetwoBTN:hover {
background-repeat: no-repeat;
background-image: url('../images/32Button_BG02.png');
}

В IE ниже, насколько я могу получить. 

#threetwoBTN {
background-repeat: no-repeat;
background-image: url('../images/32Button_BG01.png');
}

Я могу применить мое фоновое изображение, и это все, эффект наведения, который я хочу, который работает выше, делаетне работает вообще IE8.Ниже приведена структура моих тегов: 

    <div class="ContentBody">
    <div class="LeftContentBody">
        <br/>
            <!-- another div but ignored for example! -->
        <br />
        <a id="threetwoBTN">Download 32-Bit</a>
        <p>
            * ...
        </p>

Идентификатор, установленный для каждого тега 'a', позволяет мне назначать и стилизовать каждый якорь так, как он должен выглядеть, поскольку каждый тег имеет разные фоны, эффекты и т. Д.Может кто-нибудь помочь мне объяснить эту проблему, связанную с IE?

ОБНОВЛЕНИЕ:

Текст имеет отступ со страницы, поэтому пользователь не видит текст между тегами привязки.Это означает, что кнопка состоит из фонового изображения, вот и все.Для ясности я вставил ниже CSS, который я использую для стилизации тега привязки. 

.LeftContentBody a {
font-size: 10px;
text-indent: -1500px;
width: 124px;
height: 62px;
border: 2px solid #000000;
margin-left: 32px;
margin-bottom: 32px;
float: left;
clear: left;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
}

Ответы [ 2 ]

2 голосов
/ 20 апреля 2011

Вы должны добавить атрибут href к вашему тегу, попробуйте с #, он должен работать с этим, по крайней мере, для меня.

Надеюсь, это поможет.

#threetwoBTN 
{ 
    background: #CCC;     
} 
#threetwoBTN:hover {
    background: #AAA;
}

<div class="ContentBody">     
<div class="LeftContentBody">         
    <br/>            
     <!-- another div but ignored for example! -->         
    <br />        
    <a href="#" id="threetwoBTN">Download 32-Bit</a>         
    <p>* ...</p> 
</div>
</div>
0 голосов
/ 20 апреля 2011

Это изображение расположено рядом с текстом, или оно должно заменить текст?

Если он предназначен для замены текста, вы указали этот блок: ширина / высота и блок отображения?

...