Мой логотип работает в Firefox, но не в IE

Question

Мой логотип, на который я ссылаюсь в моей внешней таблице стилей CSS, работает нормально в Firefox, но не работает в Internet Explorer:

ниже код, который я использую:

#header
    {
    width: 760px; 
    float: left;
    background-color:  #fff;
}


#header h1
    {
    float: left;
    font-size: 1em;
    text-indent:-9999px;
}





#header h1 a
{

background:#fff url(images/logo.jpg) no-repeat;

width:290px; 

height: 75px;

float:left;

text-decoration:none;

}

Может кто-нибудь предложить способ, которым я могу сделать так, чтобы этот логотип корректно отображался в т. Е.?

Спасибо

Мэтт

Answer 1

попробуйте добавить overflow: hidden к любым плавающим элементам.

Answer 2

Вполне возможно, что IE рассматривает ссылку как текст и поэтому делает отступ для привязки вместо текстового содержимого внутри привязки.

Попробуйте переместить ваше свойство text-indent в правило якоря.

#header h1 {
  float: left;
  font-size: 1em;
}

#header h1 a
{
  background:#fff url(images/logo.jpg) no-repeat;
  width:290px; 
  height: 75px;
  float:left;
  text-decoration:none;
  text-indent:-9999px;
}

Имеет ли это какое-то значение?

Answer 3

, если ваш логотип (изображение) - CMYK, он не будет отображаться. Убедитесь, что ваш логотип имеет формат RGB, иначе он не будет поддерживаться другими браузерами \

KosovoCustomDevelopment

Answer 4

На самом деле, попробуйте использовать дисплей: нет; чтобы избавиться от текста в комбинированном элементе заголовка с определением "background:"

Answer 5

Я бы определенно искал что-то вроде Firebug для IE (должно быть что-то там ...), а затем проводил клик. Это не слишком научный подход, в основном просто метод проб и ошибок, но я уверен, что если проблема будет чем-то небольшим, вы можете быстро разобраться в этом :) Удачи

Answer 6

Попробуйте добавить display:block к вашему классу #header h1 a. ​​Если это все еще не работает, попробуйте заменить ваш #header h1 a background на что-то вроде ярко-розового и проверьте его уменьшение.

Обновление: Если ваш логотип свернут, попробуйте удалить поплавок: слева от этого. У вас уже есть float: слева от заголовка и заголовка h1. Вы также можете поиграть с тегом clear или, что еще лучше, реализовать clearfix