Systemizer X100
Terugkerende gebruiker
- Lid geworden
- 24 mei 2003
- Berichten
- 1.636
't Is toch ook wat? Zit ik weer met een CSS probleempje.
Het zit zo, ik heb nu al een paar dagen gewerkt aan een artblog, de meeste basisfuncties op de hoofdpagina werken al, maar het probleem zit 'm in de layout.
Ik heb ontdekt dat Internet Explorer er weer een zooitje van maakt. Gebeurt ook iedere keer...
Ik heb namelijk wat margins ingesteld (in combinatie met het zetten van een absolute positie) zodat de css boxes goed geplaatst worden. Echter, IE doet er iets raars mee.
Hier wat screenies (let even niet op de scrollbar in de linker box):
http://img72.imageshack.us/img72/6859/weblayoutff4sw.png
Dit is hoe de website eruitziet in Firefox.
En dit is wat Internet Explorer ervan maakt:
http://img72.imageshack.us/img72/3462/weblayoutie0mv.png
Je ziet het. De vertikale posities van de linker en rechterbox kloppen niet, terwijl ik daar toch echt margins heb geplaatst.
Ik zal even de CSS posten. Het linkergedeelte is .latestdrawings en het rechtergedeelte .toolbar
Ik snap het niet meer, deze boxes zijn in principe direct overgenomen van thenoodleincident.com. Heel vaag.
Weet iemand wat ik moet doen om dit goed te krijgen?
Het zit zo, ik heb nu al een paar dagen gewerkt aan een artblog, de meeste basisfuncties op de hoofdpagina werken al, maar het probleem zit 'm in de layout.
Ik heb ontdekt dat Internet Explorer er weer een zooitje van maakt. Gebeurt ook iedere keer...
Ik heb namelijk wat margins ingesteld (in combinatie met het zetten van een absolute positie) zodat de css boxes goed geplaatst worden. Echter, IE doet er iets raars mee.
Hier wat screenies (let even niet op de scrollbar in de linker box):
http://img72.imageshack.us/img72/6859/weblayoutff4sw.png
Dit is hoe de website eruitziet in Firefox.
En dit is wat Internet Explorer ervan maakt:
http://img72.imageshack.us/img72/3462/weblayoutie0mv.png
Je ziet het. De vertikale posities van de linker en rechterbox kloppen niet, terwijl ik daar toch echt margins heb geplaatst.
Ik zal even de CSS posten. Het linkergedeelte is .latestdrawings en het rechtergedeelte .toolbar
Code:
body {
background: #1D262F;
font-family: tahoma,arial,"ms sans serif";
font-size: 11px;
}
.title {
font-size: 14px;
font-weight: bold;
text-align: center;
}
.header {
background: #7699AD;
text-align: center;
margin: 20px 20px 0px 20px;
border: 5px solid #D9E4EC;
height: 80px;
voice-family: "\"}\"";
voice-family: inherit;
height: 70px;
}
html>body .header {
height: 70px;
}
.latestdrawings {
background: #7699AD;
position: absolute;
top: 100px;
left: 0px;
margin: 20px;
padding: 10px;
height: 512px;
border: 5px solid #D9E4EC;
overflow: auto;
width: 250px;
voice-family: "\"}\"";
voice-family: inherit;
width: 220px;
}
html>body .latestdrawings {
width: 220px;
}
.blogarea {
background: #9CBBCD;
margin: 20px 188px 20px 290px;
padding: 10px;
border: 5px solid #D9E4EC;
}
.blogentry {
padding: 10px 0px 15px 0px;
border-bottom: 1px dotted #444444;
}
.toolbar {
background: #7699AD;
position: absolute;
top: 100px;
right: 0px;
margin: 20px;
padding: 10px;
border: 5px solid #D9E4EC;
text-align: center;
width: 148px;
voice-family: "\"}\"";
voice-family: inherit;
width: 118px;
}
html>body .toolbar {
width: 118px;
}
Ik snap het niet meer, deze boxes zijn in principe direct overgenomen van thenoodleincident.com. Heel vaag.
Weet iemand wat ik moet doen om dit goed te krijgen?