Nieuw 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 :
html
{ height: 100%;}
*
*
{ margin: 0;
padding: 0;}
body
{ font: normal .80em Century Gothic, sans-serif;
color: #FFF;
text-shadow: 1px 1px #000;
background: rgb(65,65,65);
background-size: contain;
margin-left: auto;
margin-right: auto;}
#site_heading
{ height: 125px;
width: 240px;
padding-left: 23%;
padding-top: 5px;}
#slideShowImages
{
border: 0;
background-color: transparent;
padding-left: 50%;
height: 100px;
width: 240px;
}
#slideShowImages img
{
border: 0;
width : 100%;
height : 100%;
}
#header
{ height: 50px;
margin-left: auto;
margin-right: auto;}
#menubar
{ width: 960px;
height: 45px;
padding-top: 25px;
text-align: center;
margin: auto;
margin-left: auto;
margin-right: auto;
background: #676767;
background: -moz-linear-gradient(#676767, #1D1D1D);
background: -o-linear-gradient(#676767, #1D1D1D);
background: -webkit-linear-gradient(#676767, #1D1D1D);
background: linear-gradient(#676767, #1D1D1D);
border: 0px solid #000;
border-radius: 15px 15px 0px 0px;
-moz-border-radius: 15px 15px 0px 0px;
-webkit-border: 15px 15px 0px 0px;}
ul#menu li
{ padding: 0 0 0 0px;
list-style: none;
margin: 2px 0 0 0;
display: inline;
background: transparent;}
ul#menu li a
{
font-size: 130%;
letter-spacing: -1px;
height: 35px;
padding: 15px 20px 0 20px;
text-align: center;
color: #FFF;
text-shadow: 1px 1px #1d1d1d;
text-decoration: none;
background: transparent;}
ul#menu li a:hover
{
text-shadow: 6px 6px #000;}
#content
{
padding: 30px 0px 0 20px;
text-align: center;
margin: auto;
margin-left: auto;
margin-right: auto;
width : 950px;
}
img
{ border: 0;
margin: 0px 60px;}
a, a:hover
{ background: transparent;
outline: none;
text-decoration: underline;
color: #FFF;
}
a:hover
{ text-decoration: none;
text-shadow: 3px 3px #000;
}
ol
{ margin: 8px 0 22px 20px;}
h1, h2, h3
{ font: bold 175% Century Gothic, sans-serif;
color: #FFF;
letter-spacing: -1px;
padding: 10px 0 0 0;}
h1
{
text-shadow: 4px 4px #000;}
h2
{ text-shadow: 1px 1px #000;
font: bold 125% Century Gothic, sans-serif;
padding: 0 0 5px 0;
text-decoration: underline;}
h3
{ text-shadow: 1px 1px #000;
font: bold 125% Century Gothic, sans-serif;
padding: 0 0 5px 0;}
iframe
{ width: 940px;
height: 500px;
text-align: center;
vertical-align: middle;
margin: 0 auto;
margin-left: auto;
margin-right: auto;}
#footer
{ font-size: 130%;
letter-spacing: -1px;
padding: 25px 20px 0 20px;
margin: 0 auto;
margin-left: auto;
margin-right: auto;
width: 920px;
height: 45px;
text-align: center;
color: #FFF;
background: #676767;
background: -moz-linear-gradient(#676767, #1D1D1D);
background: -o-linear-gradient(#676767, #1D1D1D);
background: -webkit-linear-gradient(#676767, #1D1D1D);
border-radius: 0px 0px 15px 15px;
-moz-border-radius: 15px 15px 0px 0px;
-webkit-border: 15px 15px 0px 0px;
border: 0px solid #000;
-webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
-moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px;
}
html { height: 100%;} * * { margin: 0; padding: 0;} body { font: normal .80em Century Gothic, sans-serif; color: #FFF; text-shadow: 1px 1px #000; background: rgb(65,65,65); background-size: contain; margin-left: auto; margin-right: auto;} #site_heading { height: 125px; width: 240px; padding-left: 23%; padding-top: 5px;} #slideShowImages { border: 0; background-color: transparent; padding-left: 50%; height: 100px; width: 240px; } #slideShowImages img { border: 0; width : 100%; height : 100%; } #header { height: 50px; margin-left: auto; margin-right: auto;} #menubar { width: 960px; height: 45px; padding-top: 25px; text-align: center; margin: auto; margin-left: auto; margin-right: auto; background: #676767; background: -moz-linear-gradient(#676767, #1D1D1D); background: -o-linear-gradient(#676767, #1D1D1D); background: -webkit-linear-gradient(#676767, #1D1D1D); background: linear-gradient(#676767, #1D1D1D); border: 0px solid #000; border-radius: 15px 15px 0px 0px; -moz-border-radius: 15px 15px 0px 0px; -webkit-border: 15px 15px 0px 0px;} ul#menu li { padding: 0 0 0 0px; list-style: none; margin: 2px 0 0 0; display: inline; background: transparent;} ul#menu li a { font-size: 130%; letter-spacing: -1px; height: 35px; padding: 15px 20px 0 20px; text-align: center; color: #FFF; text-shadow: 1px 1px #1d1d1d; text-decoration: none; background: transparent;} ul#menu li a:hover { text-shadow: 6px 6px #000;} #content { padding: 30px 0px 0 20px; text-align: center; margin: auto; margin-left: auto; margin-right: auto; width : 950px; } img { border: 0; margin: 0px 60px;} a, a:hover { background: transparent; outline: none; text-decoration: underline; color: #FFF; } a:hover { text-decoration: none; text-shadow: 3px 3px #000; } ol { margin: 8px 0 22px 20px;} h1, h2, h3 { font: bold 175% Century Gothic, sans-serif; color: #FFF; letter-spacing: -1px; padding: 10px 0 0 0;} h1 { text-shadow: 4px 4px #000;} h2 { text-shadow: 1px 1px #000; font: bold 125% Century Gothic, sans-serif; padding: 0 0 5px 0; text-decoration: underline;} h3 { text-shadow: 1px 1px #000; font: bold 125% Century Gothic, sans-serif; padding: 0 0 5px 0;} iframe { width: 940px; height: 500px; text-align: center; vertical-align: middle; margin: 0 auto; margin-left: auto; margin-right: auto;} #footer { font-size: 130%; letter-spacing: -1px; padding: 25px 20px 0 20px; margin: 0 auto; margin-left: auto; margin-right: auto; width: 920px; height: 45px; text-align: center; color: #FFF; background: #676767; background: -moz-linear-gradient(#676767, #1D1D1D); background: -o-linear-gradient(#676767, #1D1D1D); background: -webkit-linear-gradient(#676767, #1D1D1D); border-radius: 0px 0px 15px 15px; -moz-border-radius: 15px 15px 0px 0px; -webkit-border: 15px 15px 0px 0px; border: 0px solid #000; -webkit-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px; -moz-box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px; box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 5px; }
index homepage :
<html>
<head>
<title>DEKATEC - Demey Kasper Technics</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="keywords" content="automatisatie,elektriciteit,technieken,installatie,poorten">
<meta http-equiv="content-type" content="text/html; charset=utf-8" >
<meta http-equiv="X-UA-Compatible" content="IE=9" />
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<div id="site_heading">
<table width="800" height="100" border="0">
<tr>
<td>
<h1>DEKATEC</h1>
<h3>Demey Kasper Technics</h3>
</td>
<td>
<div id="slideShowImages">
<img src="images/slide1.jpg">
<img src="images/slide2.jpg">
<img src="images/slide3.jpg">
<img src="images/slide4.jpg">
<img src="images/slide5.jpg">
<img src="images/slide6.jpg">
<img src="images/slide7.jpg">
<img src="images/slide8.jpg">
</div>
<script language="javascript" type="text/javascript" src="js/slideshow.js">
</script>
</td>
</tr>
</table>
</div>
<div id="header">
<div id="menubar">
<ul id="menu">
<li><a href="home.html" target="iframe_a">Home</a></li>
<li><a href="automatisatie.html" target="iframe_a">Automatisatie</a></li>
<li><a href="elektriciteit.html" target="iframe_a">Elektriciteit</a></li>
<li><a href="poorten.html" target="iframe_a">Poorten</a></li>
<li><a href="realisaties.html" target="iframe_a">Realisaties</a></li>
<li><a href="links.html" target="iframe_a">Links</a></li>
<li><a href="contact.html" target="iframe_a">Contact</a></li>
</ul>
</div>
</div>
<div id="content">
<iframe src="home.html" name="iframe_a" frameBorder=0;></iframe>
</div>
<div id="footer">
Demey Kasper - kasper.demey@telenet.be - 0473/72.63.26
</div>
</body>
</html>
<html> <head> <title>DEKATEC - Demey Kasper Technics</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <meta name="keywords" content="automatisatie,elektriciteit,technieken,installatie,poorten"> <meta http-equiv="content-type" content="text/html; charset=utf-8" > <meta http-equiv="X-UA-Compatible" content="IE=9" /> <link rel="stylesheet" type="text/css" href="css/style.css"> </head> <body> <div id="site_heading"> <table width="800" height="100" border="0"> <tr> <td> <h1>DEKATEC</h1> <h3>Demey Kasper Technics</h3> </td> <td> <div id="slideShowImages"> <img src="images/slide1.jpg"> <img src="images/slide2.jpg"> <img src="images/slide3.jpg"> <img src="images/slide4.jpg"> <img src="images/slide5.jpg"> <img src="images/slide6.jpg"> <img src="images/slide7.jpg"> <img src="images/slide8.jpg"> </div> <script language="javascript" type="text/javascript" src="js/slideshow.js"> </script> </td> </tr> </table> </div> <div id="header"> <div id="menubar"> <ul id="menu"> <li><a href="home.html" target="iframe_a">Home</a></li> <li><a href="automatisatie.html" target="iframe_a">Automatisatie</a></li> <li><a href="elektriciteit.html" target="iframe_a">Elektriciteit</a></li> <li><a href="poorten.html" target="iframe_a">Poorten</a></li> <li><a href="realisaties.html" target="iframe_a">Realisaties</a></li> <li><a href="links.html" target="iframe_a">Links</a></li> <li><a href="contact.html" target="iframe_a">Contact</a></li> </ul> </div> </div> <div id="content"> <iframe src="home.html" name="iframe_a" frameBorder=0;></iframe> </div> <div id="footer"> Demey Kasper - kasper.demey@telenet.be - 0473/72.63.26 </div> </body> </html>
contact pagina :
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<br>
<h1>Demey Kasper Technics</h1> <IMG SRC="images/plan.jpg" align="right" width="290" height="250">
<br><br>
<h3>Poorten - automatisatie - elektriciteit</h3>
<br><br>
<ol>
Onze-Lieve-Vrouwstraat 8 <br>
8920 Langemark - Poelkapelle <br>
0473/72.63.26<br><br>
Ondernemingsnummer : BE 0548 809 766
<br><br>
<h2>Contact formulier : </h2><br>
<form id="contact" action="MAILTO:kasper.demey@telenet.be" method="get" enctype="text/plain">
<table cellspacing="7" font size="2">
<tr>
<td>Naam : </td>
<td><input type="text" name="name" size="30"></td>
</tr>
<tr>
<td>Emailadres : </td>
<td><input type="text" name="email" size="30"></td>
</tr>
<tr>
<td>Bericht: </td>
<td><textarea name="bericht" rows="5" cols="40"></textarea></td>
</tr>
<tr>
<td></td>
<td>
<input type="submit" name="submit" id="submit" value="Versturen" />
<input type="reset" name="reset" value="Reset" />
</td>
</table>
</form>
</ol>
</body>
</html>
<html> <head> <link rel="stylesheet" type="text/css" href="css/style.css"> </head> <body> <br> <h1>Demey Kasper Technics</h1> <IMG SRC="images/plan.jpg" align="right" width="290" height="250"> <br><br> <h3>Poorten - automatisatie - elektriciteit</h3> <br><br> <ol> Onze-Lieve-Vrouwstraat 8 <br> 8920 Langemark - Poelkapelle <br> 0473/72.63.26<br><br> Ondernemingsnummer : BE 0548 809 766 <br><br> <h2>Contact formulier : </h2><br> <form id="contact" action="MAILTO:kasper.demey@telenet.be" method="get" enctype="text/plain"> <table cellspacing="7" font size="2"> <tr> <td>Naam : </td> <td><input type="text" name="name" size="30"></td> </tr> <tr> <td>Emailadres : </td> <td><input type="text" name="email" size="30"></td> </tr> <tr> <td>Bericht: </td> <td><textarea name="bericht" rows="5" cols="40"></textarea></td> </tr> <tr> <td></td> <td> <input type="submit" name="submit" id="submit" value="Versturen" /> <input type="reset" name="reset" value="Reset" /> </td> </table> </form> </ol> </body> </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
|