2014-02-09 13 views
1

Я использую ширину окна просмотра (vw) для всех элементов ширины, чтобы сделать их отзывчивыми.Отзывчивый текст нестабильный размер

Но фактическое изменение размера выглядит несколько неустойчивым.

Here как это выглядит:

enter image description here

Лучшие изображения, как он смотрит на 1366px ширины окна просмотра и дно на 766px.

Странно, что он возвращается к норме на 707px и снова разрывается на 700px и возвращается к норме на 691px и снова ломается на скорости 680px и т. Д. (Все цифры являются приблизительными).

Пожалуйста, проверьте рабочую модель примеру here

P.S. нормально ли использовать ширину vw?

+0

Почему бы не уменьшить ширину телеге к 20vw? – Nix

+0

я изменил ширину тележки до 20vw, и проблема все еще сохраняется. А также, если я добавлю еще немного свободного места, дизайн не сломается. Но это, очевидно, не будет правильным решением. – user3221449

+0

Отлично работает в Firefox. Багги, как описано в Chrome. Увидев, что - при изменении размера - свободное место на правом «хмеле», интересно, не будет ли это проблемой при округлении? – FelipeAls

ответ

0

Я никогда не работал с VW как длина ширины, но раньше у меня были проблемы, подобные этому, и обычно это было связано с макетом. Попробуйте плавать, что последний элемент справа, а не слева?

0

Известная ошибка для блоков vw при изменении размера браузера в Chrome. Размер рассчитывается неправильно, но корректируйте его самостоятельно, как только вы обновите браузер.

Я нашел исправление для этого, и я также пробовал это успешно.

causeRepaintsOn = jQuery("h1, h2, h3, p"); 
jQuery(window).resize(function() { 
    causeRepaintsOn.css("z-index", 1); 
}); 

Подробнее здесь: http://css-tricks.com/viewport-sized-typography/

Смежные вопросы