login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Site niet goed in IE6

Offline micjan - 14/02/2009 09:38
Avatar van micjanNieuw lid Hallo,

Ik ben Jan en nieuw in dit forum and in CSS. Dit is de eerste maal dat ik probeer een site te maken met CSS en HTML zoveel mogelijk gescheiden. Dit lukte in eerste instantie vrij goed (dankzij hulp van enkele vrienden) maar in IE6 blijft het mis gaan: div 'content' positioneert zich te hoog tov div 'headernav3' en verstopt dit voor een deel, genoeg echter om de horizontale navigatie bar onzichtbaar en de links onbereikbaar te maken. Ik denk dat dit zich in andere browsers ook voordoet (het bovendeel van de achtergrondafbeelding is verstopt) maar daar blijft de navigatie bar bovenaan zitten zonder navigatieproblemen dus.
kan er iemand mij helpen om dit te fixen aub?
natuurlijk al op voorhand bedankt voor tijd en moeite,

Jan
URL http://www.argos-environmental.com/test/

5 antwoorden

Gesponsorde links
Offline roberini - 14/02/2009 09:49
Avatar van roberini HTML beginner d.m.v. positioning kan je de div een stukje verschuiven.
Offline micjan - 14/02/2009 19:44
Avatar van micjan Nieuw lid ja maar, ik heb #content {overflow hidden} reeds ingesteld. Dit zou, als ik me niet vergis het uitschuiven buiten zijn positie moeten verhinderen. heb je de andere hacks in de CSS al gezien? deze werden me aangereikt door een kennis. Ik heb ondertussen al begrepen dat dit een standaard hack is voor IE6 maar ik snap niet wat het doet.

jan
Offline roberini - 14/02/2009 20:31
Avatar van roberini HTML beginner Eigenlijk moet je gewoon geen css hacks gebruiken. Dan is ie niet valid. Met positioning kom je er ook wel.
Offline mothh - 15/02/2009 16:18
Avatar van mothh Onbekend volgens mij gebruiken weinig mensen nog ie 6 dus dat kan je laten zitten
Offline micjan - 16/02/2009 21:37 (laatste wijziging 17/02/2009 23:10)
Avatar van micjan Nieuw lid Hallo, ik heb de site vanaf nul hermaakt zonder hacks en er gebeurde iets "ongelofelijks": de horizontale navigatiebar die me zoveel kopbrekens bezorgde, staat nu goed in IE6 maar niet meer in FF. De omgekeerde wereld dus. Ik gebruikte voor dat navigatie-element dezelfde code als in mijn vorige versie en nu komt de 5de link (Events) op een volgende lijn (gewrapped dus). Gecheckt in FF3 en Safari (Mac), FF3 en IE6 (PC). kan iemand mij zeggen wat hier verkeerd loopt? Bedankt op voorhand voor een reactie.
Hier is de code (niet kijken naar het aantal divs, de code kuis ik later op)
URL: http://www.argo...test2.html

HTML

html4strict code - Bekijk de code zonder highlighting - Klap code in 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
  5. <meta name="generator" content="Adobe GoLive" />
  6. <title>PureClean Air Systems</title>
  7. <link href="css/test2.css" rel="stylesheet" type="text/css" media="all" />
  8. </head>
  10.  
  11. <div id="main-container">
  12. <div id="navdiv">
  13. <ul>
  14. <li><a title="USA address information" href="-ENG/USA.html" target="_top">ARGOS Environmental Corporation </a></li>
  15. <li><a title="Europe address information" href="-ENG/EU.html" target="_top">ARGOS Environmental Europe</a></li>
  16. <li><a title="Asia address information" href="-ENG/ASIA.html" target="_top">ARGOS Environmental Asia &amp; Pacific</a></li>
  17. </ul>
  18. </div>
  19.  
  20. <div id="contentdiv">
  21. <div id="headerdiv">
  22. <h1>PureClean Air Systems</h1>
  23. </div>
  24. <div id="headernavdiv">
  25. <ul>
  26. <li><a title="go to About Us" href="-ENG/index_ENG.html" target="_top">About Us</a></li>
  27. <li><a title="go to Products" href="-ENG/products.html" target="_top">Products</a></li>
  28. <li><a title="go to Facts" href="-ENG/facts.html" target="_top">Facts</a></li>
  29. <li><a title="go to Partners" href="-ENG/partners.html" target="_top">Partners</a></li>
  30. <li><a title="go to Events" href="-ENG/events.html" target="_top">Events</a></li>
  31. </ul>
  32. </div>
  33. <div id="contentcontentdiv"></div>
  34. </div>
  35.  
  36. </div>
  37. </body>
  38. </html>


CSS:

css code - Bekijk de code zonder highlighting - Klap code in 
  1. body{
  2. background:#ffffff url(../img/achtergrond_mini.gif) repeat-y;
  3. padding-top:24px;
  4. text-align:center;
  5. font-family:verdana, arial, helvetica, sans-serif;
  6. font-size: 62.5%;
  7. }
  8.  
  9. p { }
  10. a:link { color: #000000; font-size: 1em; text-decoration: none; }
  11. a:visited { color: #336; font-size: 1em; text-decoration: none; }
  12. a:hover { color: #336; font-size: 1em; text-decoration: none; }
  13. #main-container{margin: 0 auto;width:920px;text-align:left;}
  14.  
  15. h1{ color:#395ab5; font-size:3em; text-align:right; }
  16.  
  17. #navdiv{ background: #395ab5 url(../img/logo-Argos-blauw.gif) no-repeat left top; width:310px; float: left; }
  18. #contentdiv{ width: 610px; float: left; }
  19. #headerdiv{ background-image: none; width: 600px; }
  20. #headernavdiv{ background-image: url(../img/headernav.gif); background-repeat: no-repeat; background-position: right 0; width: 603px; padding:0 0 2px; }
  21. #contentcontentdiv{ background-image: url(../img/bluesky_argos_strook.jpg); background-repeat: no-repeat; background-attachment: scroll; background-position: right top; width: 602px; height: 600px; }
  22.  
  23. /*bovenste navigatie bar*/
  24. #headernavdiv ul{ overflow:hidden; text-align:center; margin:0 0 0 100px; list-style: none; }
  25.  
  26. #headernavdiv li{ float:left; width:100px; height: 30px; }
  27.  
  28. #headernavdiv li a{
  29. color:#283f7f;
  30. font-size:1.2em;
  31. text-decoration:none;
  32. display:block;
  33. padding:5px 0 5px 0;
  34. }
  35.  
  36. #headernavdiv li a:link{}
  37. #headernavdiv li a:hover{color:#fffff7;}
  38.  
  39. /*linker navigatie panel*/
  40. #navdiv ul{ margin: 10px 5px; list-style:none; padding:75px 0 10px; }
  41.  
  42. #navdiv li{
  43. margin:10px;
  44. padding:10px;
  45. }
  46.  
  47. #navdiv li a{
  48. color:#D3FFFE;
  49. font-size:1.2em;
  50. text-decoration:none;
  51. }
  52.  
  53. #navdiv li a:link{}
  54. #navdiv li a:hover{color: #f60;}


Citaat:
Sliphead Edit: Code tags gebruiken!
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.177s