Помогите с Меню на сайте

[Michael 95]

Всем добрый вечер. Возникла одна проблема. Скорее всего это связано с CSS, но после долгих попыток я ничего не смог сделать. Чую, что нужно подправить всего лишь одну строчку, но я не в состоянии. Если требуются серьезные правки, то готов заплатить.

 

Код меню:

<div id="cssmenu">
<ul>
   <li><a href="/"><span>Главная</span></a></li>
<li><a href="/news/"><span>Новости</span></a></li>
    <li><a href="/"><span>Новичкам</span></a></li>
    <li><a href="/"><span>DOTA 2</span></a></li>
    <li><a href="/"><span>DOTA 2</span></a></li>
</ul>
</div>

CSS:

#cssmenu{width:1000px; margin:34px auto; height:37px; display:block; padding:0;} 
#cssmenu > ul {list-style:inside none; padding:0; margin:0;} 
#cssmenu > ul > li {list-style:inside none; padding:0; margin:0; float:left; display:block; position:relative;} 
#cssmenu > ul > li > a{ outline:none; display:block; position:relative; padding:12px 20px; font:bold 13px/100% Arial, Helvetica, sans-serif; text-align:center; text-decoration:none; } 
#cssmenu > ul > li > a:after{ content:''; position:absolute; top:-1px; bottom:-1px; right:-2px; z-index:99; } 
#cssmenu ul li.has-sub:hover > a:after{top:0; bottom:0;} 
#cssmenu > ul > li.has-sub > a:before{ content:''; position:absolute; top:18px; right:6px; border:5px solid transparent; } 
#cssmenu > ul > li.has-sub:hover > a:before{top:19px;} 
#cssmenu ul li.has-sub:hover > a{ background:#8cbb43; border-color:#fff; padding-bottom:13px; padding-top:13px; top:-1px; z-index:999; } 
#cssmenu ul li.has-sub:hover > ul, #cssmenu ul li.has-sub:hover > div{display:block;border: 2px solid #8cbb43;} 
#cssmenu ul li.has-sub > a:hover{background:#8cbb43; border-color:#fff;} 
#cssmenu ul li > ul, #cssmenu ul li > div{ display:none; width:auto; position:absolute; top:38px; padding:10px 0; background:#fff; border-radius:0 0 5px 5px; z-index:999; } 
#cssmenu ul li > ul{width:200px;} 
#cssmenu ul li > ul li{display:block; list-style:inside none; padding:0; margin:0; position:relative;} 
#cssmenu ul li > ul li a{ outline:none; display:block; position:relative; margin:0; padding:8px 20px; font:10pt Arial, Helvetica, sans-serif; color:#202020; text-decoration:none;} 
#cssmenu > ul > li > ul > li a:hover{ background:#8cbb43;} 
#cssmenu {background: #fff;}
#cssmenu{border-color:#8cbb43;} 
#cssmenu > ul > li > a{color:#202020;} 
#cssmenu > ul > li > a:after{border-color:#6ed1ff;} 
#cssmenu > ul > li > a:hover{background:#8cbb43;}

Проблема заключается вот в этом:

 

Как видите последняя ссылка в меню немного съезжает.

 

[mister889 61]

Это при наведении на неё она съежает?

[Lakross 3]

Напишите в лс ссылку на сайт. Бесплатно вам исправлю.

[webrocks 24]

Напишите в лс ссылку на сайт. Бесплатно Вам не исправлю

[Pro100Fun 852]

Проблема возникает при наводке на ссылку?

[Stripes 31]

разве по коду непонятно, что да, при наведении?

сайт лучше сюда скиньте, чтобы не было бесполезных сообщений: "дайте сайт в личку", если вам конечно еще не помогли

[Esite 83]

Приведённый код на самом деле работает нормально (проверил в разных браузерах и doctype), проблема скорее всего в "соседних дивах и css" которые только на сайте можно увидеть.

Чую, что нужно подправить всего лишь одну строчку

В таком громоздском коде css для простой менюшки можно и компактнее сделать, минимум раза в два.

[Anyue 1147]

Так если при наведении, то это специально так сделано. Ничего плохого в этом нету. Так написали меню вот и все.

[valentino 60]

[Pro100Fun 852]

@Esite, ну раз соседние дивы создают такую проблему, то можно просто тут для классов наведения задать margin-top: -3px; к примеру

[Michael 95]

Отправил всем ссылки в ЛС. 

[Michael 95]

Тему можно закрывать. Помог пользователь Macdec. Очень ему благодарен.

[Neuron 304]

Если у кого будут проблемы по css, обращайтесь в лс. Люблю подумать)