Я пытаюсь заменить созданное на flash меню сайта простым меню с изображением и ссылками.Я делаю это с помощью CSS.Фоновое изображение вставляется со значением CSS: background: url(/image.png)
, а меню - это просто список тегов <a>
(со стилем CSS для отображения белого цвета без подчеркивания и т. Д.).Он отлично работает в Google Chrome и IE и выглядит следующим образом:
Вот код header.php (это блок меню, который вставляется на страницу с помощью php include_once):
<div id="menu_container">
<div id="menu_top_level">
<a href="ru/about">О компании</a>
<a href="ru/news">Новости</a>
<a href="ru/headhunter">Вакансии</a>
<a href="ru/contacts">Контакты</a>
</div>
<div id="menu_medium_level">
<a href="ru/tariffs">Тарифы</a>
<a href="ru/fleet">Автопарк</a>
<a href="ru/corporate">Корпоративным клиентам</a>
<a href="ru/techs">Технологии</a>
</div>
</div>
Здесь код CSS:
#header_main {color:white; width:100%; height:76px; background: #000 url(/common/images/menuimage2.png) no-repeat center top;}
#menu_container {width: 1000px; text-align: left; }
#menu_container a {color:white;}
#menu_top_level {font-size: 14px; line-height: 17px;padding-left: 50px; float:left; clear:both;margin-top: 15px;}
#menu_top_level a {text-decoration: none; float:left; margin-right:20px;}
#menu_medium_level {font-weight:bold; font-size: 16px; line-height: 17px;padding-left: 50px; float:left; clear:both;margin-top: 10px;}
#menu_medium_level a {float:left; margin-right:20px;}
CSS соединяется со ссылкой в теге <head>
:
<link rel="stylesheet" type="text/css" href="/common/css/style.css" />
Вставка блока меню на страницу с кодом PHP:
<div align="center">
<div id="header_main">
<?php include_once($_SERVER["DOCUMENT_ROOT"]."/common/tmp/header.php"); ?>
</div>
Проблема в том, что некоторые браузеры (Firefox, Safari на Mac) при первом отображении некорректно отображают меню, например:
(стиль CSS для <a>
тег и фоновое изображение не работали).Все остальные части страницы отображаются с правильным стилем из файла CSS.
когда пользователь обновляет страницу, она всегда отображается правильно.
Кроме того, я не могу получить эту ошибку в Firefox на моих других компьютерахи когда я очищаю кеш.
Вопрос в том, как изменить код, чтобы он всегда работал корректно в любом браузере?