Archief - CSS: Contekstvak komt niet tussen 2 menu's in IE

Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.

nck2040

Legacy Member
Ik heb de tutorial die Xavez me gaf in het vorige topic uitgeprobeert maar daar kwam ik niet echt wijs uit. Dus heb ik zelf nog wat geprobeert en het lijkt wel te lukken. In Firefox is het volledig zoals ik wil, maar in IE is er wat mis, namelijk het contextvak komt niet tussen de 2menu's maar hoe zal ik het zeggen "eronder". Check het even op http://users.telenet.be/elsticky , iemand die weet hoe ik het contextvak in IE er tussen krijg?

CSS

Code:
body {
background-color: #00ff00;
text-align: center;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
overflow:-moz-scrollbars-vertical;
}

.container {
text-align: left; 
margin: 0 auto; 
width: 800px;
background-color: #F12856;
border: solid 1px black;
}

.header {
background-color:#D12856;
height:150px;
border-bottom: solid 1px black;
}

.menu {
background-color:#E12856;
float: left; 
width: 120px;
border-bottom: solid 1px #000000;
}

.menu2 {
background-color:#E12856;
float: right;
width:120px;
border-bottom: solid 1px #000000;
}

.content {
margin-left:120px;
width:558px;
background-color:#C12856; 
border-left: solid 1px #000000;
border-right: solid 1px #000000;
}

.footer {
background-color: #0000ff;
clear: both; 
border-top: solid 1px black;
}

HTML:

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>Positioneren met css en html</title>
<link rel="stylesheet" type="text/css" href="toujanewebsite.css">
</head>

<body>
    <div class="container">
        <div class="header">Hier komt je logo, zie je dat de hoogte 150px is?
        </div>
            <div class="menu">Lorem ipsum dolor sit amet.
            </div>
            <div class="menu2">Lorem ipsum dolor sit amet.
            </div>
                <div class="content">
                </div>
            <div class="footer">hier kan je nog iets kwijt in de footer.
            </div>
    </div>

</body>
</html>

Bram

Legacy Member
ik zou het zo eens proberen:
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>Positioneren met css en html</title>
<link rel="stylesheet" type="text/css" href="toujanewebsite.css">
</head>

<body>
    <div class="container">
        <div class="header">Hier komt je logo, zie je dat de hoogte 150px is?
        </div>
            <div class="menu">Lorem ipsum dolor sit amet.
            </div>
                <div class="content">
                </div>
            <div class="menu2">Lorem ipsum dolor sit amet.
            </div>
            <div class="footer">hier kan je nog iets kwijt in de footer.
            </div>
    </div>

</body>
</html>
en dan de css zo
Code:
body {
background-color: #00ff00;
text-align: center;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
overflow:-moz-scrollbars-vertical;
}

.container {
text-align: left; 
margin: 0 auto; 
width: 800px;
background-color: #F12856;
border: solid 1px black;
}

.header {
background-color:#D12856;
height:150px;
border-bottom: solid 1px black;
}

.menu {
background-color:#E12856;
float: left; 
width: 120px;
border-bottom: solid 1px #000000;
}

.menu2 {
background-color:#E12856;
float: left;
width:120px;
border-bottom: solid 1px #000000;
}

.content {
float: left;
width:558px;
background-color:#C12856; 
border-left: solid 1px #000000;
border-right: solid 1px #000000;
}

.footer {
background-color: #0000ff;
clear: both; 
border-top: solid 1px black;
}
nu doet ie echter iets maf in IE met de background color van de footer, wat echter simpel op te lossen is met een onnozel js scriptje of met een iets langere CSS manier (google eens naar equal height columns, die van PIE is heel goed)

nck2040

Legacy Member
bedankt dat heeft al geholpen, maar inderdaad in IE doet hij raar met die footer, ik zal eens zoeken achter die equal dinges, als iemand zo al het antwoord weet ook even zeggen aub ;)

nck2040

Legacy Member
even dubbelpost voor de duidelijkheid...


hehe ik heb het makkelijk opgelost door men footer een hoogte mee tegeven :rofl:
Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
Terug
Bovenaan