basneeleman
Nieuwe gebruiker
- Lid geworden
- 28 dec 2012
- Berichten
- 4
Ik ben bezig met het maken van een website,
nu zit de website er in google chrome, firefox, opera enz gewoon goed uit.
maar in internet explorer klopt het ineens helemaal niet meer.
de css:
Ik heb het al geprobeerd met
dat maakt het iets beter maar nog niet perfect.
Ook als ik een doctype toevoeg (weet niet precies welke ik moet gebruiken) dan klopt er ook in chrome enz. niet meer van.
snapt iemand er nog iets van?
Alvast bedankt voor de moeite,
Bas
nu zit de website er in google chrome, firefox, opera enz gewoon goed uit.
maar in internet explorer klopt het ineens helemaal niet meer.
Code:
<html>
<head>
<title>Majarante - Home</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="index">
<div id="container">
<div id="header">
<h1>Majarante</h1>
</div>
<div id="menu">
<ul>
<li><a href="Index.html">Home</a><li>
<li><a href="Coaching.html">Coaching</a><li>
<li><a href="Voeding.html">Voeding</a><li>
<li><a href="MassageStoel.html">Massage</a><li>
<li><a href="Contact.html">Contact</a><li>
</ul>
</div>
<div id="Menu2">
<ul>
<li><a href="#"></a><li>
<li><a href="#"></a><li>
<li><a href="#"></a><li>
<li><a href="#"></a><li>
<li><a href="#"></a><li>
</ul>
</div>
<div id="article">
<p>
Het moderne leven in onze westerse maatschappij is gehaast.
We willen en moeten veel, in hoog tempo.
Werk, gezin, familie, vrienden en hobby’s, er zijn veel dingen die tijd van ons vragen.
</p>
<p>
Spanning en stress kunnen het gevolg zijn en het risico om uit balans te raken is soms groot.
Veel factoren kunnen daarvan de oorzaak zijn.
Denk aan werkdruk, gezin, financiële problemen, een traumatische ervaring, slechte voeding of te weinig slaap.
</p>
<p>
In de meeste gevallen zal ons lichaam een signaal geven dat we het te druk hebben.
Het is de kunst om deze signalen te herkennen.
Als vitaliteitscoach kan ik je hierbij helpen.
Ik kijk niet alleen naar de gedachten en overtuigingen maar ook naar emoties, gevoel en lichamelijke factoren die een rol bij de oorzaak van het probleem kunnen zijn.
Om de achterliggende oorzaken aan te pakken en je leven weer in balans te krijgen gebruik ik verschillende methodes.
</p>
</div>
<div style="clear:both;"></div>
<div id="footer">
©2012
</div>
</div>
</div>
</body>
</html>de css:
Code:
@font-face {
font-family: 'infinityregular';
src: url('Lettertype/infinity-webfont.eot');
src: url('Lettertype/infinity-webfont.eot?#iefix') format('embedded-opentype'),
url('Lettertype/infinity-webfont.woff') format('woff'),
url('Lettertype/infinity-webfont.ttf') format('truetype'),
url('Lettertype/infinity-webfont.svg#infinityregular') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'juraregular';
src: url('Lettertype/jura-regular-webfont.eot');
src: url('Lettertype/jura-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('Lettertype/jura-regular-webfont.woff') format('woff'),
url('Lettertype/jura-regular-webfont.ttf') format('truetype'),
url('Lettertype/jura-regular-webfont.svg#juraregular') format('svg');
font-weight: normal;
font-style: normal;
}
*{
padding:0;
margin:0;
}
p {
padding: 0;
line-height: 1.5em;
}
html, body {
height: 100%;
color: black;
background: gray;
text-align: center;
}
#container {
overflow: Auto;
width: 60%;
margin: 0 auto;
text-align: left;
background: rgba(45, 45, 45, 1);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
Max-width: 100%;
Min-width: 320px;
}
#header{
height:100px;
width: 100%;
font-size:1.3em;
background-image: url();
background-repeat:no-repeat;
background-position:-70px -15px;
line-height: 60px;
-webkit-border-top-right-radius: 10px;
-webkit-border-top-left-radius: 10px;
-moz-border-radius-topright: 10px;
-moz-border-radius-topleft: 10px;
border-top-right-radius: 10px;
border-top-left-radius: 10px;
background-image:url('afbeeldingen/background-header.png');
background-position: 100% 5%;
}
#header h1 {
font-family: "infinityregular", "Times New Roman", "Times, serif";
font-size:65;
color: rgba(102, 204, 51, 1);
padding: 0 0 0 3.5%;
}
#menu{
overflow: hidden;
height: 40px;
background: rgba(102, 204, 51, 1);
}
#menu2{
overflow: hidden;
height: 40px;
background: rgba(102, 204, 51, 0.8);
}
#menu ul, #menu2 ul{
list-style-type: none;
height: 40px;
width: 100%;
margin: auto;
}
#menu ul a, #menu2 ul a {
padding-right: 14px;
padding-left: 14px;
line-height: 40px;
text-decoration: none;
font-family: "Georgia", "Times New Roman", "Times, serif";
font-size: 14px;
color: Black;
}
#menu ul a:hover, #menu2 ul a:hover{
color: rgba(45, 45, 45, 1);
}
#menu ul li, #menu2 ul li {
float: left;
}
#article {
border-style: solid;
border-width: 2px;
margin: 1% 1% 1% 1%;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
background-color: rgba(255, 255, 255, 0.6);
overflow: hidden;
float:left;
width:97%;
border-color: rgba(102, 204, 51, 1);
}
#article p {
margin: 1% 1% 1% 1%;
float: left;
line-height: 125%;
font-family: "juraregular", "Century Gothic", "Times new romance";
}
#article ul {
margin: 1% 10% 1% 4%;
float: left;
line-height: 125%;
font-family: "juraregular", "Century Gothic", "Times new romance";
list-style-type: disc;
}
#Contact #article p {
line-height: 125%;
}
#footer{
margin: 0 auto;
position: relative;
bottom: 0;
width: 100%;
background: rgba(45, 45, 45, 1);
height: 20px;
text-align:center;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
}Ik heb het al geprobeerd met
Code:
<meta http-equiv="X-UA-Compatible" content="IE=9" />dat maakt het iets beter maar nog niet perfect.
Ook als ik een doctype toevoeg (weet niet precies welke ik moet gebruiken) dan klopt er ook in chrome enz. niet meer van.
snapt iemand er nog iets van?
Alvast bedankt voor de moeite,
Bas
