Выравнивание пунктов меню с задержкой

[m1kas]

Стили меню прописаны следующим образом. При загрузке страницы, все пункты меню сдвигаются влево в кучу (float:left). Спустя секунду только встают на свои места. Что тут не так?

div.top-menu-holder {width: 959px;margin: 0px auto;}div.top-menu {position: absolute;width: 957px;height: 50px;border: 1px #e1e2e6 solid;background-color: white;margin-top: -26px;overflow: hidden;}div.top-menu ul {padding: 0px;margin: 0px;list-style: none;width: 100%;overflow: hidden; background: white}div.top-menu ul li {display: block;float: left;background: url(images/menu-sep.gif) no-repeat left 20px;font-size: 11px;text-transform: uppercase;}div.top-menu ul li a {display: block;padding-top: 18px;padding-bottom: 18px;color: #090c0d;text-decoration: none;}div.top-menu ul li a:hover, div.top-menu ul li a.activ, div.top-menu ul li a.activ:hover {color: #e21544;text-decoration: none;}

Edited April 3, 2014 by m1kas

[Great Rash]

Как минимум у вас CSS с ошибкой написан.

[m1kas]

С какой?

[npofopr]

;;

[m1kas]

;;

при редактировании случайно добавил, но тем не менее вопрос остаётся открытым...

в остальном же вроде все нормально?

[Great Rash]

Не взглянув на живой сайт, сказать, что-то трудно.

[m1kas]

Не взглянув на живой сайт, сказать, что-то трудно.

 

сайт

Edited April 3, 2014 by m1kas

[Switch74]

скорее всего, потому что у вас меню выравнивается через js, который отрабатывает после полной загрузки страницы

[Great Rash]

Вот это:

$(window).load(function(){    links = $("div.top-menu ul li a");    wdth = 0;    for (i=0;i<links.length;i++) {        wdth += $(links[i]).width();    }    pads = Math.round(((957-wdth)/links.length)/2);    $("div.top-menu ul li a").css({        "padding-left":pads+'px',        "padding-right":pads+'px'    });});

заменить на это:

$(function(){    links = $("div.top-menu ul li a");    wdth = 0;    for (i=0;i<links.length;i++) {        wdth += $(links[i]).width();    }    pads = Math.round(((957-wdth)/links.length)/2);    $("div.top-menu ul li a").css({        "padding-left":pads+'px',        "padding-right":pads+'px'    });});

[m1kas]

 

Вот это:

$(window).load(function(){    links = $("div.top-menu ul li a");    wdth = 0;    for (i=0;i<links.length;i++) {        wdth += $(links[i]).width();    }    pads = Math.round(((957-wdth)/links.length)/2);    $("div.top-menu ul li a").css({        "padding-left":pads+'px',        "padding-right":pads+'px'    });});

заменить на это:

$(function(){    links = $("div.top-menu ul li a");    wdth = 0;    for (i=0;i<links.length;i++) {        wdth += $(links[i]).width();    }    pads = Math.round(((957-wdth)/links.length)/2);    $("div.top-menu ul li a").css({        "padding-left":pads+'px',        "padding-right":pads+'px'    });});

 

Спасибо большое! Очень помогли!