IE9 beim Zoomen des Bildschirms Problem

in IE 9 bezogen auf die Zoomfunktion des Browsers.IE9 beim Zoomen des Bildschirms Problem

In dem Code unten habe ich eine Reihe von Div (Klasse = 'Box', 200 Pixel breit)) alle Floating in einem großen Elternteil div (Klasse = 'scrollarea', 5.000 Pixel breit). Der sichtbare Teil der Seite wird vom obersten div (class = 'content', 400px wide) gesteuert.

Wenn der Benutzer einen Link auswählt, wird ein anderes Div (mit Anker-Tags) angezeigt.

Das Problem tritt auf, wenn Sie die Option "Scroll to div 2" ausgewählt haben und dann versuchen, das IE-Browserfenster zu verkleinern (sagen wir zu 70%). Die Innen-Divs werden während des Zoomens neu positioniert und die Anfangsposition ist hat verloren. Bitte beachten Sie, dass dies nur in IE geschieht.

Gibt es eine Möglichkeit, das zu beheben?

.content 
 
     { 
 
      background-color: Yellow; 
 
      width: 400px; 
 
      overflow: scroll; 
 
     } 
 

 
     .scrollarea 
 
     { 
 
      width: 5000px; 
 
     } 
 

 
     .box 
 
     { 
 
      width: 200px; 
 
      margin-right: 200px; 
 
      background-color: gray; 
 
      float: left; 
 
     }

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    
 
</head> 
 
<body> 
 
    <a href="#area1">Scroll to div 1</a> <a href="#area2">Scroll to div 2</a> <a href="#area3"> 
 
     Scroll to div 3</a> <a href="#area4">Scroll to div 4</a> 
 
    <br /> 
 
    <br /> 
 
    <div class="content"> 
 
     <div class="scrollarea"> 
 
      <div id="area1" class="box"> 
 
       DIV 1 
 
       <br />     
 
       irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla 
 
       pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia 
 
       deserunt mollit anim id est laborum. 
 
      </div> 
 
      <div id="area2" class="box"> 
 
       DIV 2 
 
       <br /> 
 
       
 
       irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla 
 
       pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia 
 
       deserunt mollit anim id est laborum. 
 
      </div> 
 
      <div id="area3" class="box"> 
 
       DIV 3 
 
       <br /> 
 
       Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor 
 
       incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud 
 
       exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute 
 
       irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla 
 
       pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia 
 
       deserunt mollit anim id est laborum. 
 
      </div> 
 
      <div id="area4" class="box"> 
 
       DIV 4 
 
       <br /> 
 
       Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor 
 
       incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud 
 
       exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute 
 
       irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla 
 
       pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia 
 
       deserunt mollit anim id est laborum. 
 
      </div> 
 
     </div> 
 
    </div> 
 
</body> 
 
</html>

Quelle

2016-04-26 Creative Enemy

<head><!--[if IE]> 
<meta HTTP-EQUIV="REFRESH" content="0; url=crap.html"> 
<![endif]--> 
</head>

nicht benötigt IE < = 9 heute

Quelle

2016-04-26 13:20:27

Aber Kunde fragen, es zu sein, so dass nur –

IE9 beim Zoomen des Bildschirms Problem

Antwort

Verwandte Themen