yoursun

Да, я думаю, стоит остановиться на предыдущем варианте. Он в принципе меня устраивает, я и не рассчитывала на то, что мой сайт будут смотреть через телефон :-) .

Вам же огромное, огромное спасибо за участие и помощь, вы меня очень выручили!!! :-)  :-)  :-)

поменяла в варианте для маленьких экранов width: 450px; на width: 550px; - меню стало в две строчки, но тогда оно не уложится, видимо в min-width: 320px

на экране 800х600 получается так как на скрине

Вставила, но что-то не сработало ((((

А куда именно в css меню надо этот код вставить, или в любое место можно? И этот код так и должен начинаться с @, или перед ним надо какой-то тег еще написать?

Ну да, тогда скроллер появляется (((

Получилось!!!  Ой, я прям вас расцеловать готова! Огромное вам спасибо!!!

 Всем добрый день! Сделала, пользуясь разной инфой с интернета и форумов горизонтальное меню для своего "резинового" сайта, и вроде бы все нормально получилось, на моем мониторе с разрешением 1440х900 пункты меню встали по центру страницы, но при открытии сайта на мониторах с другим разрешением меню едет в сторону, на большем размере смещается влево, а на меньшем, бьется на две строки. Все мои попытки изменить это ни к чему не приводят, те советы что даются на просторах инета, типа text-align: center; или #menu {margin:0 auto;} не помогают. Подскажите, пожалуйста, что нужно сделать чтобы на всех мониторах меню стояло как надо (по центру страницы и в одну строку)?

Вот ссылка на тест. страницу сайта http://yoursun.myjino.ru/index.html

Ниже скрины с двух разных мониторов.

Это код моего меню:

#menu {font-family:  "Times New Roman", "Times CY", "Nimbus Roman No9 L", serif; text-align: center;}

#menu ul
 {
margin: 0; 
padding: 0; 
float: left;
padding-left: 25%;
width: 100%; 
text-align: center;
} 

#menu ul li { display: inline; } 
#menu ul li a { 
float: left; 
color: #696969; 
padding: 5px 11px; 
text-decoration: none; 
font-size: 130%;
text-align: center;
background: #9ACD32 url(slant.gif) no-repeat top right; padding: 0px 25px 0px 10px; }
border-right: 2px solid #FFFAFA;

#menu ul li a: visited{color: #696969; } 
#menu a:hover {color: #000;}
#menu ul li .current{ 
padding-top: 6px; 
padding-bottom: 4px; 
text-align: center;}