Слипается меню при первой загрузке

[Zverushka]

http://zverushka.zz.mu/upakovka/

Слипаетмся меню (слово к слову) при первой загрузке в хроме, обновляю и все нормально - что делать?(( Заказчику надо уже показывать.

Я так поняла, что это косяк letter-spacing, но тогда с Inline-block вообще фигня получается - word-spacing нельзя, letter-spacing нельзя - остаются только двухсторонние маргины - что совсем уныло (((

Edited November 27, 2013 by Zverushka

[npofopr]

Inline-block вообще фигня получается - word-spacing нельзя, letter-spacing нельзя

чего вдруг? 

и у меня ничего не слипается. 

[lexxcode]

Так поставь просто margin: 0 30px; для li да и все

[Zverushka]

Слипается на 2х разных компах с разными ОС в хроме. Чтобы 2й раз слиплось - надо браузер перезапустить.

 

 

Так поставь просто margin: 0 30px; для li да и все

 

Пока так и сделала(... Какой-то баг с определением ширины letter пока не загружен шрифт...

Edited November 27, 2013 by Zverushka

[lexxcode]

Пока так и сделала(... Какой-то баг с определением ширины letter пока не загружен шрифт...

 

имхо, лучше сделать даже margin-left: 62px;, а для первого пункта margin-left: 0; через first-child. Это и надежнее, да и правильней, я считаю

[Zverushka]

имхо, лучше сделать даже margin-left: 62px;, а для первого пункта margin-left: 0; через first-child. Это и надежнее, да и правильней, я считаю

 

Не выйдет - хром не умеет выравнивать по центру такой маргин - все меню вправо уедет. Он также криво с ним работает как и с word-spacing, только letter-spacing не уезжал при вырвании по центру, пока сплющивание не наступило)...

ps. И я кстати обычно использую маленькую хитрость, я пишу li + li { margin-left: 62px; }

Edited November 27, 2013 by Zverushka

[lexxcode]

Не выходи - хром не умеет выравнивать по центру такой маргин - все меню вправо уедет.

 

Да лаааадно  http://jsfiddle.net/alexriz/g7t96/show/

[Zverushka]

удалено

Edited November 27, 2013 by Zverushka

[lexxcode]

Тогда вот тут в чем ошибка? Видите меню сдвинуто http://jsfiddle.net/g7t96/5/

 

Ну так списки же.... padding который по-умолчанию стоит в браузере убрать нужно http://jsfiddle.net/alexriz/g7t96/6/

[npofopr]

Заглядывайте чаще в инспектор кода :-) Там же даже цветами выделяются все отступы :-)

[Zverushka]

Нда.. меня пришибло еще с этой темы  http://htmlforum.ru/index.php?showtopic=46144&hl=

Там меню криво выравнивалось с маргинами, если word-spacing убирался

http://jsfiddle.net/XZ8Kw/12/

Этот опыт я по памяти перенесла на текущий, но с несхлопнутыми ворд-спейсингом...

[Zverushka]

Ну все - оказалось и БЛОКИ! Самые обыкновенные с Letter-spacing при первой загрузке в хроме слипаются. Пришлось предыдущий сайт чинить - обратился заказчик с "жалобой".

[npofopr]

В http://purecss.io/ тоже используется letter-spacing и ничего никогда не слипалось.

Да много где оно используется.

[Zverushka]

 Не вижу там меню с отступами.

http://zverushka.zz.mu/upakovka/ конкретно почему вот тут самое первое меню слипается?.... Я думала некорретно обрабатывает размеры шрифта при загрузке. Но такое случилось уже в другом проекте, но просто с блоками, у которых фиксированные размеры ширины.

[swandev]

 Не вижу там меню с отступами.

http://zverushka.zz.mu/upakovka/ конкретно почему вот тут самое первое меню слипается?.... Я думала некорретно обрабатывает размеры шрифта при загрузке. Но такое случилось уже в другом проекте, но просто с блоками, у которых фиксированные размеры ширины.

Не могу понять, что значит слипается?

[Zverushka]

Вот так ГЛАВНАЯЧТОПОЧЕМУОТЗЫВЫКАККОНТАКТЫ - прямо вот так. После этого обновляешь страничку и все нормально. Так происходит только при первой загрузке.

[lexxcode]

Не могу понять, что значит слипается?

 

 

первая загрузка:

А должно быть (рефреш):

[swandev]

 

Не могу понять, что значит слипается?

 

 

первая загрузка:

А должно быть (рефреш):

 

 

Странно, но у меня все нормально.

[lexxcode]

это в хроме происходит, и только при первой загрузке, когда браузер это все добро закешировал проблема не возникает

[Zverushka]

Ага, я уже хотела скриншот вставить. Спасибо тебе, Алекс.

При это раз через раз происходит - видимо, когда какой-то скрипт или еще что с небольшой задержкой грузится - вот так происходит. Баг довольно рандомный, поэтому видимо многие о нем не знают.

[lexxcode]

По-крайней мере я тебе уже говорил, как это лучше решить. А что касается почему так происходит, то скорее всего просто багло вылезло, браузер видимо банально не может посчитать расстояние пока не загрузится посторонний шрифт

[Zverushka]

Я тоже так думала, но тоже самое произошло с блоками фиксированной ширины на другом сайте, где ширина известна заранее.

[lexxcode]

пример можно?

[Zverushka]

Вот в разделе "каталог бигуди" - http://zverushka.zz.mu/bigudy2/

Кстати только что и слипся.  Хотя каждому блоку задана ширина 267 пикселей.

Edited November 30, 2013 by Zverushka

[swandev]

Вот в разделе "каталог бигуди" - http://zverushka.zz.mu/bigudy2/

Кстати только что и слипся.  Хотя каждому блоку задана ширина 267 пикселей.

 

Ничего не слипается( Уже и кеш чистил и браузер перезапускал (хром 32)

[Zverushka]

Слипается, если загрузка шрифта произошла чуть дольше, чем нужно браузеру для рендеринга - как мне кажется, и тогда, не зная истинный letter-spacing (видимо undefined) второе значение, которые мы плюсуем через css также становится андефайнед...

Я подозреваю, что ff: arial родителю должно решить проблему, только вот времени тестировать нет...