Обновить/пересчитать css

<div id="box1">
    <div id="box2" style="height:60%"></div>
</div>

Обновление. Оказалось, что это какая-то глупость: был родительский div, который я не закрыл должным образом. Мне все еще любопытно, почему изменение некоторых CSS в веб-инспекторе удалось это исправить. Спасибо всем!

Проблема возникает в браузерах webkit (Safari, Mobile Safari, Chrome, браузер Android), но не в Firefox:

При изменении размера окна высота box1 изменяется с помощью javascript, но box2 не расширяется/не сжимается до 60% от новой высоты box1, пока я не зайду в веб-инспектор и вручную не изменю любое правило css для любого элемента, если это не атрибут стиля этого элемента. (Поэтому правило, которое я меняю, должно исходить из встроенного файла css или файла .css, но не имеет значения, какой файл)

Что здесь происходит? Почему это происходит? Если есть какой-то пересчет или обновление css, как мне заставить это произойти при изменении размера окна?


css refresh webkit height web-inspector
person Juliet    schedule 28.07.2011    source источник
comment
Почему бы просто не изменить размер div#box2 и в вашем JS?   -  person Jason Gennaro    schedule 28.07.2011
comment
Пробовал - все равно не работает.   -  person Juliet    schedule 28.07.2011

Ответы (3)


arrow_upward
2
arrow_downward

Я думаю, что это ошибка браузера.

Возможно, что-то вроде elemnt_box2.stye=element_box2.style вызовет обновление, но это обходной путь.

Имейте в виду, что обновления DOM из Javascript полностью обрабатываются не сразу, а после завершения выполнения скрипта. Это для эффективности. Это может означать, что каскадные изменения невидимы для сценария до следующей точки входа.

person spraff    schedule 28.07.2011

arrow_upward
0
arrow_downward

У меня была аналогичная проблема, когда переключение float:left, а затем немедленное включение, приводило к небольшому div прыжку вверх или вниз по строке, но, как здесь, только в Chrome, а не в Firefox. Решение, которое сработало для меня, было удалено где-то еще clear:left.

person TankorSmash    schedule 26.02.2013

arrow_upward
0
arrow_downward

Оказалось, что это какая-то глупость: был родительский div, который я не закрыл должным образом. Мне все еще любопытно, почему изменение некоторых CSS в веб-инспекторе удалось это исправить. Спасибо всем!

person Juliet    schedule 31.05.2013