HTML / CSS масштабирование

Question

Возникли некоторые трудности с масштабированием элементов HTML.В FF или Chrome взгляните на (очень, очень простой, маленький код):

http://jsfiddle.net/92wHQ/4/

В раскрывающемся списке выберите 150%.Черно-белый градиентный блок будет масштабироваться до 150% от его исходного размера.Теперь, когда он масштабирован, обратите внимание, что появляется горизонтальная полоса прокрутки, а вертикальная полоса прокрутки расширяется, чтобы вместить новые, увеличенные, масштабированные высоту и ширину.

Теперь переключайтесь со 150% на 50%.Поле градиента действительно масштабируется до 50%, но обратите внимание, что (вертикальная) полоса прокрутки не сжимается для размещения новой, меньшей, масштабированной высоты.Вместо этого под полем градиента есть куча пустых пробелов.

Почему браузеры обновляют полосы прокрутки для масштабирования больше 100%, но не меньше 100%?Как я могу получить такое же поведение для менее 100%, как и для более 100%?Мне не нужен этот пробел.

Answer 1

изменил что-то в скрипке.пожалуйста, проверьте, если это то, что вы хотите:

http://jsfiddle.net/92wHQ/7/

тогда полосы прокрутки фактически основаны на измерениях 100% и более.обратите внимание на то, что полоса прокрутки 100% и полоса прокрутки 50% имеют одинаковый «размер», тогда как выполнение 150% - единственный раз, когда оно становится меньше.

Answer 2

У меня есть некоторое представление о том, что происходит:

Масштабирование влияет только на градиентный блок, но не на контейнер div, внутри которого он находится. Поэтому, когда вы масштабируете блок до 150%, блок теперь сравнительно больше, чем размер контейнера, внутри которого он находится (контейнер всегда равен 496x250), поэтому он размещает полосы прокрутки.

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

Там может быть несколько разных способов справиться с этим. Основная проблема заключается в том, что вы не обрабатываете изменение размера / масштаба контейнера div.