0

Помогите выровнять css меню по центру. Все перепробовал, нечего не выходит, может у Вас выйдет. Вот код.

.hovermenu ul {
    font: 20px verdana;
    padding - left: 0;
    margin - left: 0;
    height: 20px;
}

.hovermenu ul li {
    list - style: none;
    display: inline;
}

.hovermenu ul li a {
    padding: 9px 0.5em;
    text - decoration: none;
    float: left;
    color: black;
    background - color: transparent;
    border: px solid transparent;
}

.hovermenu ul li a: hover {
    background - color: #1E90FF;

}

html>body .hovermenu ul li a:active{ /* эффект при наведении мыши */
border-style: solid;
}
2
  • Код поправьте сначала, jsfiddle вам красным подсвечивает, что не все в порядке с разметкой. отделите css, html и js (если есть) - там есть поля ввода для каждого из них. И после этого укажите что вы перепробовали. 31 мая 2012 в 13:02
  • jsfiddle.net/qgxUA/1 Отделил ставил тег centr, пробовал в разные места ставить. Оно только немного в бок отодвигается
    – илья
    31 мая 2012 в 13:08

2 ответа 2

3

Плохо отделили. float:left - для a лишнее, у вас есть уже display:inline для li, все будет в строчку и так. Надо после этого отцентрировать содержимое ul, добавить:

.hovermenu {text-align:center}

upd. или лучше:

.hovermenu ul {text-align:center}

см. тут

0

Немного исправил. Вот что получилось. С вертикальным выравниванием, думаю справитесь =)

<head>
<style type="text/css">.hovermenu ul{

font: 20px verdana;
padding-left: 0;
margin-left: 0;
height: 20px;
}

.hovermenu ul li{
list-style: none;
display: inline;
}

.hovermenu ul li a{
padding: 9px 0.5em;
text-decoration: none;

color: black;
background-color: transparent;
border: px solid transparent;
}

.hovermenu ul li a:hover{
background-color:#1E90FF;

}

html>body .hovermenu ul li a:active{ /* эффект при наведении мыши */
border-style: solid;
}
</style>
</head>
<body style="background-image:url(http://s2.ipicture.ru/uploads/20120531/pbb8FT9l.jpg);background-repeat:repeat-x repeat-x">
<!-- Save for Web Slices (ВСЕЕЕЕЕЕЕЕЕЕЕ.psd) -->

<head>

<body style="color:Yellow; background-color:#FFFFFF "><div class="hovermenu">
<table style="height:100%;width:100%;">
    <tr><td style="text-align:center;">
<ul>
<li><a href="#">Мои лоты</a></li>
<li><a href="#">Отзывы</a></li>
<li><a href="#">Добавить в избранное</a></li>
<li><a href="#">Задать вопрос</a></li>
</ul>
        </td></tr>
 </table>
</div>

<!-- End Save for Web Slices -->
</body>
2
  • Спасибо большое. Если не секрет, что изменили?
    – илья
    31 мая 2012 в 13:27
  • шикарно. из серии "css - фигня, таблицы - наше все!". -1. 31 мая 2012 в 13:30

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.