Почему в ie8 зум расширяет div в другом соотношении, чем при расширении текста? - PullRequest
1 голос
/ 10 января 2012

В основном, когда я увеличиваю текст, это портит мое форматирование.Похоже, что увеличение масштаба текста отличается от увеличения в желтом поле.

Может кто-нибудь сказать мне, почему это происходит?

Ниже приведен пример кода:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">


    
        
            
                
                .highlightLine
                {
                    filter: alpha(opacity=50);
                    opacity: 0.5;
                    background-color: #e8e800;
                    position: absolute;
                    z-index: 1;
                    -moz-user-select: none;
                }

                .clickAbleTable
                {
                    border-width: 0px;
                    border-collapse: collapse;
                    position: relative;
                }

                .zeroAll
                {
                    padding: 0px;
                    margin: 0px;
                    border: 0px;
                }
            

    
    
        
            
                
                    
                        This is sample text. This is sample text. This is sample text. 
This is sample text. This is sample text. This is sample text. 
This is sample text. This is sample text. This is sample text. 
This is sample text. This is sample text. This is sample text. 
This is sample text. This is sample text. 
This is sample text. This is sample text. 
This is sample text. 
This is sample text. 
This is sample text. This is sample text. This is sample text. 
This is sample text. This is sample text. This is sample text. 

Примечание: желтые линии должны оставаться по обе стороны от слова sample.

1 Ответ

0 голосов
/ 05 декабря 2013

IE имеет разные алгоритмы для текстовых и статических элементов по сравнению с позиционированными элементами и плавающими элементами.Алгоритм adaptive zoom работает как для текстовых, так и для статических элементов:

Масштабирование размеров является одним из наиболее важных улучшений в IE8 Adaptive Zoom.Размеры, указанные в абсолютных единицах (например: дюймы, см, мм и т. Д.) Или в зависимости от устройства и шрифта (например, px, ex, em и т. Д.), Масштабируются в соответствии с уровнем масштабирования.Следовательно, при 200% 100px становится 200px, а 20pt становится 40pt.Размерно-зависимые измерения, т. Е. Проценты и авто, не масштабируются, поскольку они вычисляются во время макета.Поэтому при 200% ширина 50% области просмотра не становится равной 100%.Это заметное изменение по сравнению с увеличением в IE7.

И поэтому для позиционированных элементов и поплавков:

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

Используйте следующееметатег в IE10 для исправления масштабирования в режиме совместимости IE8:

<meta http-equiv="X-UA-TextLayoutMetrics" content="natural" />

Ссылки

...