ugrás a tartalomhoz

IE-ben felbontás és/vagy nézet kicsinyítés hatására eltolódik az oldal képe

tashubanya · 2012. Okt. 16. (K), 15.30
itt látható az "eltolódás".

Css-ben érzem a problémát, pontosabban abban, hogy van egy többlépcsős, lenyíló menüm (nav dobozban), amit ha használok csak akkor jelentkezik ez a probléma.
A html:
  1. <ul>    
  2. <li><a href="eskuvo.htm"><img src="images/eskuvo_menu.png" /></a>  
  3. <ul>  
  4. <li><a href="eskuvo1.htm" ><img src="images/galeria1_menu.png" /></a></li>  
  5. <li><a href="eskuvo2.htm" ><img src="images/galeria2_menu.png" /></a></li>  
  6. <li><a href="eskuvo3.htm" ><img src="images/galeria3_menu.png" /></a></li>  
  7. </ul>  
  8. </li>  
  9. </ul>   
A css:
  1. * {  
  2.     margin: 0;  
  3.     padding: 0;  
  4. }  
  5.   
  6. body {  
  7.     background: #2B1500;  
  8.     background-repeat: no-repeat;  
  9.     scrollbar-face-color:#FFFFFF;  
  10.     scrollbar-highlight-color:#FFFFFF;  
  11.     scrollbar-3dlight-color:#FFFFFF  
  12.     scrollbar-darkshadow-color:#FFFFFF;  
  13.     scrollbar-shadow-color:#FFFFFF;  
  14.     scrollbar-arrow-color:#FFFFFF;  
  15.     scrollbar-track-color:#FFFFFF;  
  16. }  
  17. #wrapper {   
  18.     margin: 20px auto 20px auto;  
  19.     width: 850px;   
  20.     height: 475px;  
  21.     background: #8F7860;  
  22.     border: 1px solid #D1BCA7;  
  23. }  
  24.   
  25. #content {   
  26.     float: right;  
  27.     width: 700px;   
  28.     min-height: 425px;  
  29.     background-image: url(../images/content.jpg);  
  30.     background-repeat: no-repeat;  
  31. }  
  32.   
  33.   
  34. #header {  
  35.     width: 850px;  
  36.     height: 50px;  
  37.     background-image: url(../images/header.jpg);  
  38.     background-repeat: no-repeat;  
  39. }  
  40.   
  41. #nav{  
  42.     float: left;  
  43.     width: 150px;  
  44.     height: 425px;   
  45.     background-image: url(../images/nav.jpg);  
  46.     background-repeat: no-repeat;  
  47. }  
  48. #nav ul {   
  49.     list-style-type: none;    
  50. }    
  51.   
  52. #nav ul li {    
  53.     width: 150px;    
  54.         
  55. }    
  56.       
  57. #nav ul li a {    
  58.     width: 150px;    
  59.     height: auto;   
  60. }  
  61.    
  62. #nav ul li a {    
  63.     width: 150px;    
  64.     height: auto;   
  65. }  
  66.    
  67. #nav ul ul {    
  68.     position: relative;  
  69.     width: 150px;    
  70.     display: none;  
  71.     height: 100%;  
  72. }    
  73.      
  74. #nav ul li:hover ul{    
  75.     display: block;  
  76.              
  77. }   
  78.    
  79. #nav ul li ul a:hover{    
  80.     display: block;  
  81. }    
  82.   
  83. #nav a:hover {   
  84.  }    
  85.      
  86. #nav a {    
  87.     display: block;    
  88.     margin: 0;    
  89. }    
  90.      
  91. #nav li {    
  92.     position:relative;    
  93.     width: 150px;    
  94. }    
A margin-tól, a padding-on át a position-ig mindent próbáltam állítani, de nem jövök rá a megoldásra.
Biztos kiböki a szemem, de ha 1 év alatt nem jöttem rá, gondoltam segítséget kérek...

Nagyon szépen köszönöm előre is, ha valaki foglalkozik a kérdéssel!!
‹ Jquery Dojo 1.8 - Custom build - CSS-t is de hogyan? ›
 ■
1

Szerintem tartalmat befogó

hunkris · 2012. Okt. 16. (K), 15.35
Szerintem tartalmat befogó divnek kéne min width értéket adni.
2

min-width

tashubanya · 2012. Okt. 16. (K), 15.49
Szia!
Sajnos attól az egész szétcsúszik.
De nem a menüvel lesz a gond!
Az már biztos, mert lepucoltam és úgy sem jó, tehát css.
3

Böngészőm elavult?

tashubanya · 2012. Okt. 16. (K), 16.05
Megnéztem a nagyok oldalait is, és azok is "elmásznak", többek közt a weblabor is.
Azt hiszem régen lett az explorer frissítve a gépemen-mivel nem használom, ezért, ha nincsen más magyarázat a jelenségre, törölnétek ezt a témát, hogy ne legyen itt egy olyan felvetés, ami értelmetlen?
Köszönöm előre is, és elnézést, hogy nem voltam elég körültekintő!
4

Mások is használhatnak régi

Hidvégi Gábor · 2012. Okt. 16. (K), 16.22
Mások is használhatnak régi böngészőt, miattuk érdemes foglalkozni a problémával.
5

Probléma

tashubanya · 2012. Okt. 16. (K), 16.29
Örülök, hogy valós a probléma.
Így is eléggé szégyellem magam, hogy ilyen apróságon akadok el :(
6

A position: relative;-t írd

KMartinR4 · 2012. Nov. 2. (P), 18.42
A
  1. position: relative;  
-t írd át
  1. position: absolute;  
-ra. A relatív pozíciót az IE nem kezeli jól. Még a 8 se, pláne, ha régebbi...

Természetesen ezután meg kell adnod, hogy mennyivel lejjebb vagy följebb fognak megjelenni az almenük, de így nem fog elcsúszni az oldal... Mármint, ha ez a probléma forrása.