Блог

Я использую три разных шрифта. Вот мой @fontface

 @font-face {
font-family: 'Mikadan-Regular'; 
src: url('../fonts/mikadan/eot/style_134713.eot');
src: url('../fonts/mikadan/eot/style_134713.eot?#iefix') format('embedded-opentype'),
     url('../fonts/mikadan/woff/style_134713.woff') format('woff'),
     url('../fonts/mikadan/ttf/style_134713.ttf') format('truetype'),
     url('../fonts/mikadan/svg/style_134713.svg#Mikadan-Regular') format('svg');
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'MuseoSans500';
src: url('../fonts/museosans_500/MuseoSans_500-webfont.eot');
src: url('../fonts/museosans_500/MuseoSans_500-webfont.eot?#iefix') format('embedded-opentype'),
     url('../fonts/museosans_500/MuseoSans_500-webfont.woff') format('woff'),
     url('../fonts/museosans_500/MuseoSans_500-webfont.ttf') format('truetype'),
     url('../fonts/museosans_500/MuseoSans_500-webfont.svg#MuseoSans500') format('svg');
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'MuseoSlab500';
src: url('../fonts/museoslab_500/Museo_Slab_500-webfont.eot');
src: url('../fonts/museoslab_500/Museo_Slab_500-webfont.eot?#iefix') format('embedded-opentype'),
     url('../fonts/museoslab_500/Museo_Slab_500-webfont.woff') format('woff'),
     url('../fonts/museoslab_500/Museo_Slab_500-webfont.ttf') format('truetype'),
     url('../fonts/museoslab_500/Museo_Slab_500-webfont.svg#MuseoSlab500') format('svg');
font-weight: normal;
font-style: normal;
}
  

Первый и третий работают нормально.

Второй указан для тега body как:

 body, button, input, select, textarea {
font: 16px/1.625 MuseoSans500 "Lucida Grande", "Lucida Sans Unicode", "Trebuchet MS", sans-serif;
_font-size: 1em;
color: #333;
}
  

Это прекрасно работает в Chrome и Safari

Однако в Opera 11.50 и Firefox 4.0.1 плохие новости; весь стек шрифтов не работает, и шрифт отображается как обычный старый шрифт с засечками (фу!)

Я думаю, что проблема связана с Museo, так как, когда я извлекаю Museo из стека шрифтов, он отображается правильно.

Я использую эти браузеры в Windows 7.

Вам не хватает запятой.

 font: 16px/1.625 MuseoSans500 "Lucida Grande"
font: 16px/1.625 MuseoSans500, "Lucida Grande"
                            ^^^ add this comma
  

Хотя сейчас вам не хватает этой запятой, исходя из того, что вы сказали, у вас возникли проблемы со шрифтом MuseoSans500 для основного текста. Когда вы удалили его, все было в порядке. Я думаю, что теперь, когда вы показываете нам свой код, запятая отсутствует.

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

 body, button, input, select, textarea {
  font-family: MuseoSans500; /* start with this one by itself */
  font-size: 16px;
  line-height: 1.625;
  color: #333;
}