sarnath
Legacy Member
Ik heb een probleem voor met Firefox vb Internet explorer.
Mijn site werkt correct in Firefox maar niet in IE, als ik het in IE kan fixen ziet de site er niet meer uit in Firefox, nu kan ik niet echt vinden hoe ik het moet oplossen aangezien ik het volgens mij toch doen volgens de W3 richtlijnen.
De site bestaat uit een vierkant waarin 4 vierkanten zitten die zowat in de hoeken van het groot vierkant moeten zitten.
Daarvoor is de position van het grote vierkant relatief en die van de vierkantjes erin absoluut, als ik "relatief" wegdoe dan werkt het in Internet Explorer, en in firefox niet, laat ik het staan klopt het in firefox maar niet in IE.
html pagina:
de css pagina:
Mijn site werkt correct in Firefox maar niet in IE, als ik het in IE kan fixen ziet de site er niet meer uit in Firefox, nu kan ik niet echt vinden hoe ik het moet oplossen aangezien ik het volgens mij toch doen volgens de W3 richtlijnen.
De site bestaat uit een vierkant waarin 4 vierkanten zitten die zowat in de hoeken van het groot vierkant moeten zitten.
Daarvoor is de position van het grote vierkant relatief en die van de vierkantjes erin absoluut, als ik "relatief" wegdoe dan werkt het in Internet Explorer, en in firefox niet, laat ik het staan klopt het in firefox maar niet in IE.
html pagina:
Code:
<html>
<head>
<link rel="StyleSheet" href="bartleemans_stijl.css" type="text/css" title="layout">
</head>
<body>
<div class="container">
<div class="top_left">
</div>
<div class="top_right">
</div>
<div class="bottom_left">
</div>
<div class="bottom_right">
</div>
</div>
</body>
</html>
de css pagina:
Code:
.container {
height:550px;
width: 600px;
padding: 4px;
margin-left:auto; margin-right:auto;
text-align:center;
position: relative;
border:1mm #3d83f6 groove;
}
.top_left {
border: 1px dashed #FF0000;
color: #000000;
text-align: center;
width: 250px;
height: 250px;
float: left;
background-image:url("top_left.jpg");
border:1px #C0C0C0 groove;
position: absolute;
}
.top_right {
border: 1px dashed #FF0000;
color: #000000;
text-align: center;
width: 250px;
height: 250px;
float: left;
left:350px;
background-image:url("top_right.jpg");
border:1px #C0C0C0 groove;
position: absolute;
}
.bottom_left {
border: 1px dashed #FF0000;
color: #000000;
text-align: center;
width: 250px;
height: 250px;
float: left;
top:300px;
background-image:url("bottom_left.jpg");
border:1px #C0C0C0 groove;
position: absolute;
}
.bottom_right {
border: 1px dashed #FF0000;
color: #000000;
text-align: center;
width: 250px;
height: 250px;
float: left;
left:350px;
top:300px;
background-image:url("bottom_right.jpg");
border:1px #C0C0C0 groove;
position: absolute;
}
