ugrás a tartalomhoz

Internet explorer megjelenítési probléma

frostywarrior · 2011. Aug. 9. (K), 13.22
Sziasztok!

Van egy webáruházam és chrome, firefox-al tök jól megjelenít mindent, de valamiért IE-ben elcsúsztatja az oldalsó menü rendszert.. Miért???
Ez előtt tök jól működöt...

http://wizardsoft.hu/bizomany.php
http://wizardsoft.hu/hasznalt.php
  1. <div class="menuLocationDivRight">  
  2.         <!--Ide kerül majd a jobb oldali reklámok,bannerek stb..-->  
  3.         <div class="Center"> <img src="pictures/szamitogep.jpg" alt="Számítógép"/>  
  4.         <a href="http://www.pcarena.hu/" title="PC Aréna Partner"><img src="http://www.pcarena.hu/images/banner/pcarena-deal.png" alt="PC Aréna Partner" border="0" align="top"></a>  
  5.           <p class="brandText">Made by WizardSoft Kft. <br />  
  6.             Minden jog Fenntartva!</p>  
  7.         </div>  
  8.       </div>  
  9.       <div class="menuLocationDivLeft">  
  10.         <div id="menu">  
  11.           <!--Ide kerül majd a bal oldali menüpontok stb..-->  
  12.           <ul>  
  13.             <h1 class="menuText">Számítástechnika</h1>  
  14.             <ul>  
  15.               <li><a href="programozas.php" ><span >Programozás</span></a></li>  
  16.               <li><a href="rendszer.php" ><span>Rendszer Kiépítés</span></a></li>  
  17.             </ul>  
  18.             <h1 class="menuText">Informatikai Értékesítés</h1>  
  19.             <ul>  
  20.               <li><a href="bizomany.php" class="current"><span>Bizományos Termék</span></a></li>  
  21.               <li><a href="hasznalt.php" ><span>Használt Termék</span></a></li>  
  22.               <li><a href="wizardsoft.computeremporium.hu" ><span>Új Termék</span></a></li>  
  23.             </ul>  
  24.             <h1 class="menuText">Egyéb Munkaköreink</h1>  
  25.             <ul>  
  26.               <li><a href="piac.php" ><span>Piacfelmérés </span></a></li>  
  27.               <li><a href="epito.php" ><span>Építőmesteri Munkák </span></a></li>  
  28.             </ul>  
  29.           </ul>  
  30.         </div>  
  31.       </div>  
  32.       <div class="footer"> </div>  
  33.     </div>  
  34.     <!--contactContent-->  
  35.   </div>  
  36.   <!--logoDiv-->  
  37. </div>  
  38. <!--mainDiv-->  
  39. </body>  
  40. </html>  
  1. .menuLocationDiv {  
  2.   
  3.     position: relative;  
  4.   
  5.     width: 950px;  
  6.   
  7.     height: 26px;  
  8.   
  9.     left: 50%;  
  10.   
  11.     bottom: 0;  
  12.   
  13.     margin-left: -475px;  
  14.   
  15.     margin-top: 0;  
  16.   
  17.     background-color:#CCCCCC;  
  18.   
  19. }  
  20.   
  21. .menuLocationDivRight {  
  22.   
  23.     background-image:url(pictures/bar.jpg);  
  24.   
  25.     position: absolute;  
  26.   
  27.     width: 180px;  
  28.   
  29.     height: 680px;  
  30.   
  31.     top: 5px;  
  32.   
  33.     left:82%;/*background-color:#dcdcdc;*/  
  34.   
  35. }  
  36.   
  37. .menuLocationDivLeft {  
  38.   
  39.     background-image:url(pictures/bar.jpg);  
  40.   
  41.     position: absolute;  
  42.   
  43.     width: 180px;  
  44.   
  45.     height: 680px;  
  46.   
  47.     top: 5px;  
  48.   
  49.     left:-2.05%;/*background-color: #dcdcdc;*/  
  50.   
  51. }  
  52.   
  53. /*MenuBalOldal*/  
  54.   
  55. #menu {  
  56.   
  57.     position: relative;  
  58.   
  59.     margin-top:23px;  
  60.   
  61.     margin-left:3px;  
  62.   
  63.     text-align: left;  
  64.   
  65.     font-size:12px;  
  66.   
  67.     width: 150px;  
  68.   
  69.     font-weight:bold;  
  70.   
  71. }  
  72.   
  73. #menu ul {  
  74.   
  75.     padding: 2px 1px 3px 13px;  
  76.   
  77.     list-style-type: none;  
  78.   
  79.     width: 150px;  
  80.   
  81.     text-align: left;  
  82.   
  83.     background-color: #cccccc;  
  84.   
  85. }  
  86.   
  87. #menu ul li {  
  88.   
  89.     margin: 0px 5px 2px 0px;  
  90.   
  91.     padding: 0px 2px 0px 0px;  
  92.   
  93. }  
  94.   
  95. #menu ul li a {  
  96.   
  97.     /*color:#1f09a9;*/  
  98.   
  99.     color:black;  
  100.   
  101.     text-decoration: none;  
  102.   
  103.     padding: 5px 10px;  
  104.   
  105.     display: block;  
  106.   
  107.     /*border: 0.5px dashed #1f09a9;*/  
  108.   
  109.     /*background-color: #f9ea90;*/  
  110.   
  111.     background-color: #cccccc;  
  112.   
  113. }  
  114.   
  115. #menu ul li a:hover, #menu ul li a.current {  
  116.   
  117.     color: white;  
  118.   
  119.     text-decoration: none;  
  120.   
  121.     background-color: black;  
  122.   
  123. }  
  124.   
  125. #menu ul li a.current span {  
  126.   
  127.     display:block;  
  128.   
  129.     width:auto;  
  130.   
  131. }  
A másik problémám, hogy az alsó lábjegyzet kép részletet is feltolja a menüre, mi lehet a bibi??

http://wizardsoft.hu/elfelejtettjelszo.php


Előre is köszönöm válaszaitokat.
‹ CSS + opera Ajax? ›
 ■
1

CSS-ben miért állítgatod a

pinguka · 2011. Aug. 9. (K), 14.42
CSS-ben miért állítgatod a position-öket relative-ra meg absolute-ra?
Van ennek valami különösebb oka? Mert szerintem nincsen, és valószínüleg emiatt is csúszik szét az oldalad.

Nézd át ezeket a dolgokat, különösen a float-ot. Gondolom ennek a helyettesítésére használod a pozicionálásokat.
3

hiába

frostywarrior · 2011. Aug. 9. (K), 17.15
Hiába pozicionálom jobbra és balra is az elemeket, mivel nem táblázatba vannak, hanem css-el megírva és ha én most jobbra tolnám akkor igen csak szép eredményt kapnék utána.

Egyébként sose értettem ezt a relative, absolut pozició megadást, hogy mi a különbség közötte.
4

relative vs absolute

Poetro · 2011. Aug. 9. (K), 17.49
Ha valaminek a pozíciója relatív, akkor továbbra is elfoglalja azt a helyet, ahova kerülne, de elmozgathatod (az eredeti helye ekkor üres marad). Pozícionálása az eredeti helyéhez képest történik. Ha egy elem absolute van pozicionálva, akkor a koordinátája ahhoz a legközelebbi szülőhöz képest relatív, amelyik absolute vagy relative van pozicionálva (ha nincs ilyen, akkor az ablakhoz képest).
Az absolute pozicionált elem kiesik a dokumentum folyamából, abból nem foglal helyet, és méretei akkorára zsugorodnak, amekkorában a tartalom minimálisan elfér.
  1. <!DOCTYPE HTML>  
  2. <html lang="en-US">  
  3. <head>  
  4.   <meta charset="UTF-8">  
  5.   <title></title>  
  6.   <style type="text/css">  
  7.     .absolute {  
  8.       position: absolute;  
  9.     }  
  10.     .relative {  
  11.       position: relative;  
  12.     }  
  13.   </style>  
  14. </head>  
  15. <body>  
  16.   <div class="normal">  
  17.     <div class="relative">  
  18.       <div class="normal">  
  19.         <div class="absolute absolute1">  
  20.           <div class="normal">  
  21.             <div class="absolute absolute2"></div>  
  22.           </div>  
  23.         </div>  
  24.       </div>  
  25.     </div>  
  26.   </div>  
  27. </body>  
  28. </html>  
Ebben az esetben az absolute1 a relative osztályú képest lesz pozicionálva, míg az absolute2 az absolute1-hez képest.

Ebből következik, hogy minden abszolút relatív :-)
2

margó

Poetro · 2011. Aug. 9. (K), 15.01
Azért mert az IE más margó méretet használ az UL elemekhez. Mondjuk állíts be 0-t. Egyébként a sötét szürke háttéren, te hogyan látod a fekete betűket?
5

doctype

Karvaly84 · 2011. Aug. 9. (K), 19.05
Hello!

A Dokumentum típus deklaráció előtt ne legyen szóköz! Mert Explorer ilyenkor már "trükközik"!
6

ja és még valami, ha UTF-8 a

Karvaly84 · 2011. Aug. 9. (K), 19.17
ja és még valami, ha UTF-8 a kódlap, ajánlott az UTF-8 BOM nélkül használata éppen ez miatt mert rejtett karaktereket helyez el a dokumentum első sorába.
7

Rájöttem már arra hogy a bár miért csinálta ezt.

frostywarrior · 2011. Aug. 9. (K), 20.09
Sziasztok!

Valami elírás volt benne a href-elésnél és kicseréltem az index.php href részére és utána mindegyik oldal jó lett.Hogy miért azt nem tudom? :O De az biztos, hogy már mos kezdem utálni az IE-t :D...

Nem soká feltöltöm az eredeti szerverre és megmutatom(kb.holnap).

Nagy itt a kavarodás egy kicsit mert most chrome-ba, mozillába és IE is menni-e kell tökéletesen. Van két szabadnapom és hát bele feccelem az időm :)

Remélem mindenki segítség adó jó tanácsát megtudom fogadni és bele tudom írni a webáruházba ...

Ha van esetleg még ötletetek, hogy lehet ne még jobbá tenni. Szívesen várom.

Előre is köszi.
8

<!--[if IE]> <link

Lord Fren · 2011. Aug. 10. (Sze), 21.20
  1. <!--[if IE]>  
  2.         <link rel="stylesheet" type="text/css" href="all-ie-only.css" />  
  3. <![endif]-->  
Használd ezt ha csak IEvel van a baj. A másik hogy ie 7-8-9 től sok problémát vet fel, ezért manapság át szoktuk állítani az ieket úgy hogy ie7 legyen.
  1. <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">  
Így verzió töredezettséget is eliminálsz. A fenti kóddal pedig csak ie-re jellemző hibákat orvosolhatod ^^