login  Naam:   Wachtwoord: 
Registreer je!
 Forum

problemen IE

Offline kasperdemey - 05/07/2016 19:53 (laatste wijziging 05/07/2016 23:21)
Avatar van kasperdemeyNieuw lid Ik heb enkele problemen met mijn site, hopelijk kan iemand mij helpen, want mijn kennis is te klein om dit op te lossen.

1) Uitlijning van de #site_heading => telkens als ik verander van browser komt deze op een andere plaatst te staan ???

2) Als ik mijn site open in IE 7,8,9 heb ik het problemen dat delen van mijn CSS niet gebruikt worden, ook in IE 7 & 8 heb ik een JS toegevoegd om afbeelding te laten verschijnen, dit werkt enkel op IE 9 en alle andere browsers, maar niet in IE 7&8 ???

code css :

  1. html
  2. { height: 100%;}
  3.  
  4. *
  5. *
  6. { margin: 0;
  7. padding: 0;}
  8.  
  9. body
  10.  
  11. { font: normal .80em Century Gothic, sans-serif;
  12. color: #FFF;
  13. text-shadow: 1px 1px #000;
  14. background: rgb(65,65,65);
  15. background-size: contain;
  16. margin-left: auto;
  17. margin-right: auto;}
  18.  
  19. #site_heading
  20.  
  21. { height: 125px;
  22. width: 240px;
  23. padding-left: 23%;
  24. padding-top: 5px;}
  25.  
  26. #slideShowImages
  27.  
  28. {
  29. border: 0;
  30. background-color: transparent;
  31. padding-left: 50%;
  32. height: 100px;
  33. width: 240px;
  34.  
  35.  
  36. }
  37.  
  38. #slideShowImages img
  39.  
  40. {
  41. border: 0;
  42. width : 100%;
  43. height : 100%;
  44. }
  45.  
  46.  
  47. #header
  48.  
  49. { height: 50px;
  50. margin-left: auto;
  51. margin-right: auto;}
  52.  
  53.  
  54. #menubar
  55.  
  56. { width: 960px;
  57. height: 45px;
  58. padding-top: 25px;
  59. text-align: center;
  60. margin: auto;
  61. margin-left: auto;
  62. margin-right: auto;
  63. background: #676767;
  64. background: -moz-linear-gradient(#676767, #1D1D1D);
  65. background: -o-linear-gradient(#676767, #1D1D1D);
  66. background: -webkit-linear-gradient(#676767, #1D1D1D);
  67. background: linear-gradient(#676767, #1D1D1D);
  68. border: 0px solid #000;
  69. border-radius: 15px 15px 0px 0px;
  70. -moz-border-radius: 15px 15px 0px 0px;
  71. -webkit-border: 15px 15px 0px 0px;}
  72.  
  73.  
  74.  
  75. ul#menu li
  76.  
  77. { padding: 0 0 0 0px;
  78. list-style: none;
  79. margin: 2px 0 0 0;
  80. display: inline;
  81. background: transparent;}
  82.  
  83. ul#menu li a
  84.  
  85. {
  86. font-size: 130%;
  87. letter-spacing: -1px;
  88. height: 35px;
  89. padding: 15px 20px 0 20px;
  90. text-align: center;
  91. color: #FFF;
  92. text-shadow: 1px 1px #1d1d1d;
  93. text-decoration: none;
  94. background: transparent;}
  95.  
  96.  
  97.  
  98. ul#menu li a:hover
  99.  
  100. {
  101. text-shadow: 6px 6px #000;}
  102.  
  103. #content
  104.  
  105. {
  106. padding: 30px 0px 0 20px;
  107. text-align: center;
  108. margin: auto;
  109. margin-left: auto;
  110. margin-right: auto;
  111. width : 950px;
  112.  
  113. }
  114.  
  115.  
  116. img
  117.  
  118. { border: 0;
  119. margin: 0px 60px;}
  120.  
  121. a, a:hover
  122.  
  123. { background: transparent;
  124. outline: none;
  125. text-decoration: underline;
  126. color: #FFF;
  127. }
  128.  
  129. a:hover
  130.  
  131. { text-decoration: none;
  132. text-shadow: 3px 3px #000;
  133.  
  134. }
  135.  
  136. ol
  137.  
  138. { margin: 8px 0 22px 20px;}
  139.  
  140. h1, h2, h3
  141.  
  142. { font: bold 175% Century Gothic, sans-serif;
  143. color: #FFF;
  144. letter-spacing: -1px;
  145. padding: 10px 0 0 0;}
  146.  
  147. h1
  148.  
  149. {
  150. text-shadow: 4px 4px #000;}
  151.  
  152. h2
  153.  
  154. { text-shadow: 1px 1px #000;
  155. font: bold 125% Century Gothic, sans-serif;
  156. padding: 0 0 5px 0;
  157. text-decoration: underline;}
  158.  
  159. h3
  160.  
  161. { text-shadow: 1px 1px #000;
  162. font: bold 125% Century Gothic, sans-serif;
  163. padding: 0 0 5px 0;}
  164.  
  165.  
  166. iframe
  167.  
  168. { width: 940px;
  169. height: 500px;
  170. text-align: center;
  171. vertical-align: middle;
  172. margin: 0 auto;
  173. margin-left: auto;
  174. margin-right: auto;}
  175.  
  176. #footer
  177.  
  178. { font-size: 130%;
  179. letter-spacing: -1px;
  180. padding: 25px 20px 0 20px;
  181. margin: 0 auto;
  182. margin-left: auto;
  183. margin-right: auto;
  184. width: 920px;
  185. height: 45px;
  186. text-align: center;
  187. color: #FFF;
  188. background: #676767;
  189. background: -moz-linear-gradient(#676767, #1D1D1D);
  190. background: -o-linear-gradient(#676767, #1D1D1D);
  191. background: -webkit-linear-gradient(#676767, #1D1D1D);
  192. border-radius: 0px 0px 15px 15px;
  193. -moz-border-radius: 15px 15px 0px 0px;
  194. -webkit-border: 15px 15px 0px 0px;
  195. border: 0px solid #000;
  196. -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
  197. -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
  198. box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
  199. }






index homepage :

  1. <html>
  2. <head>
  3.  
  4. <title>DEKATEC - Demey Kasper Technics</title>
  5. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  6. <meta name="keywords" content="automatisatie,elektriciteit,technieken,installatie,poorten">
  7. <meta http-equiv="content-type" content="text/html; charset=utf-8" >
  8. <meta http-equiv="X-UA-Compatible" content="IE=9" />
  9. <link rel="stylesheet" type="text/css" href="css/style.css">
  10.  
  11.  
  12. </head>
  13.  
  14.  
  15.  
  16.  
  17.  
  18. <body>
  19.  
  20. <div id="site_heading">
  21.  
  22. <table width="800" height="100" border="0">
  23. <tr>
  24.  
  25. <td>
  26.  
  27. <h1>DEKATEC</h1>
  28. <h3>Demey Kasper Technics</h3>
  29.  
  30. </td>
  31.  
  32.  
  33. <td>
  34.  
  35.  
  36. <div id="slideShowImages">
  37.  
  38. <img src="images/slide1.jpg">
  39. <img src="images/slide2.jpg">
  40. <img src="images/slide3.jpg">
  41. <img src="images/slide4.jpg">
  42. <img src="images/slide5.jpg">
  43. <img src="images/slide6.jpg">
  44. <img src="images/slide7.jpg">
  45. <img src="images/slide8.jpg">
  46.  
  47. </div>
  48.  
  49. <script language="javascript" type="text/javascript" src="js/slideshow.js">
  50. </script>
  51.  
  52.  
  53. </td>
  54. </tr>
  55. </table>
  56.  
  57.  
  58. </div>
  59.  
  60.  
  61.  
  62.  
  63.  
  64. <div id="header">
  65.  
  66.  
  67. <div id="menubar">
  68.  
  69. <ul id="menu">
  70.  
  71. <li><a href="home.html" target="iframe_a">Home</a></li>
  72. <li><a href="automatisatie.html" target="iframe_a">Automatisatie</a></li>
  73. <li><a href="elektriciteit.html" target="iframe_a">Elektriciteit</a></li>
  74. <li><a href="poorten.html" target="iframe_a">Poorten</a></li>
  75. <li><a href="realisaties.html" target="iframe_a">Realisaties</a></li>
  76. <li><a href="links.html" target="iframe_a">Links</a></li>
  77. <li><a href="contact.html" target="iframe_a">Contact</a></li>
  78.  
  79.  
  80. </ul>
  81.  
  82. </div>
  83.  
  84.  
  85. </div>
  86.  
  87.  
  88.  
  89.  
  90. <div id="content">
  91.  
  92.  
  93. <iframe src="home.html" name="iframe_a" frameBorder=0;></iframe>
  94.  
  95.  
  96.  
  97. </div>
  98.  
  99.  
  100.  
  101.  
  102. <div id="footer">
  103.  
  104. Demey Kasper - kasper.demey@telenet.be - 0473/72.63.26
  105.  
  106. </div>
  107.  
  108.  
  109.  
  110. </body>
  111.  
  112. </html>



contact pagina :
  1. <html>
  2.  
  3. <head>
  4. <link rel="stylesheet" type="text/css" href="css/style.css">
  5. </head>
  6.  
  7. <body>
  8.  
  9.  
  10. <br>
  11.  
  12. <h1>Demey Kasper Technics</h1> <IMG SRC="images/plan.jpg" align="right" width="290" height="250">
  13.  
  14. <br><br>
  15.  
  16. <h3>Poorten - automatisatie - elektriciteit</h3>
  17.  
  18. <br><br>
  19.  
  20. <ol>
  21.  
  22. Onze-Lieve-Vrouwstraat 8 <br>
  23. 8920 Langemark - Poelkapelle <br>
  24. 0473/72.63.26<br><br>
  25.  
  26. Ondernemingsnummer : BE 0548 809 766
  27.  
  28. <br><br>
  29.  
  30. <h2>Contact formulier : </h2><br>
  31.  
  32.  
  33. <form id="contact" action="MAILTO:kasper.demey@telenet.be" method="get" enctype="text/plain">
  34. <table cellspacing="7" font size="2">
  35.  
  36. <tr>
  37. <td>Naam : </td>
  38. <td><input type="text" name="name" size="30"></td>
  39. </tr>
  40.  
  41. <tr>
  42. <td>Emailadres : </td>
  43. <td><input type="text" name="email" size="30"></td>
  44. </tr>
  45.  
  46. <tr>
  47. <td>Bericht: </td>
  48. <td><textarea name="bericht" rows="5" cols="40"></textarea></td>
  49. </tr>
  50.  
  51. <tr>
  52. <td></td>
  53. <td>
  54. <input type="submit" name="submit" id="submit" value="Versturen" />
  55. <input type="reset" name="reset" value="Reset" />
  56. </td>
  57. </table>
  58. </form>
  59.  
  60.  
  61. </ol>
  62.  
  63.  
  64. </body>
  65. </html>




3) Hoe komt het dat de grootte van mijn lettertype afhankelijk is van browser tot browser

4) Ik heb een invulformulier gemaakt, dit werkt enkel het bericht en e-mail zou ik graag in het tekstvak krijgen van mijn mail. Liefst zonder PHP indien mogelijk

Hopelijk kan iemand mij enkele verklarende antwoorden geven

mod edit: code tags

2 antwoorden

Gesponsorde links
Offline Thomas - 05/07/2016 23:32
Avatar van Thomas Moderator Hoe belangrijk is het dat deze oude (prehistorische?) browsers nog ondersteund worden?

Ik zou het eerlijk gezegd omdraaien: maak websites die webstandaarden volgen en ga er (wellicht tegen beter weten in) vanuit dat browsers deze richtlijnen volgen.

Mogelijk kun je op deze site meer informatie vinden welke dingen wel/niet werken in bepaalde browsers.

Persoonlijk zou ik meer in moderne(re) browsers investeren tenzij je echt niet anders kunt.
Offline TimTimSch - 09/07/2016 14:31
Avatar van TimTimSch Nieuw lid Ik heb het volgende op mijn website: onder ie 9 ziet de gebruiker een notificatie dat de browser oud is. Dit doe ik door middel van deze website. Heel makkelijk te installeren en je hoeft je geen zorgen te maken dat de website er niet goed uitziet.
Maar als je toch graag die oude browsers wilt ondersteunen dan zou ik eens naar deze website kijken.
Op deze website kun je de percentage zien van de actuele gebruikers van Internet Explorer, het is niet veel.
Gesponsorde links
Je moet ingelogd zijn om een reactie te kunnen posten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.335s