Hallo,
Ben al een uurtje of 6 (hoe doe ik het?) bezig met onderstaand probleem :-/ Hoog tijd om de vraag te stellen dacht ik zo.
Ik heb drie DIV's naast elkaar staan. De middelste daarvan moet 140 pixels naar links komen te staan ten opzichte van de middellijn van het scherm. Deze DIV heeft een vaste breedte van 475px. De DIV aan de linkerzijde van deze DIV moet het scherm horizontaal volledig (en precies) uitvullen; hierin komt namelijk een foto te staan. De DIV aan de rechterzijde moet hetzelfde doen.
Verder moet de minimale hoogte van alledrie de DIV's 200 px. zijn. Echter wanneer de content van de middelste DIV deze hoogte overschreidt, zouden alledrie en hun container (middle) hun hoogte moeten aanpassen.
Vele dingen geprobeerd maar krijg het niet voor elkaar.
In de voorbeeldcode heb ik linkerdiv en rechterdiv even op 10px vastgezet en laten zien dat de content nu de verticale pixels overschreidt.
Bij voorbaat dank voor het meedenken! Wouter
Ben al een uurtje of 6 (hoe doe ik het?) bezig met onderstaand probleem :-/ Hoog tijd om de vraag te stellen dacht ik zo.
Ik heb drie DIV's naast elkaar staan. De middelste daarvan moet 140 pixels naar links komen te staan ten opzichte van de middellijn van het scherm. Deze DIV heeft een vaste breedte van 475px. De DIV aan de linkerzijde van deze DIV moet het scherm horizontaal volledig (en precies) uitvullen; hierin komt namelijk een foto te staan. De DIV aan de rechterzijde moet hetzelfde doen.
Verder moet de minimale hoogte van alledrie de DIV's 200 px. zijn. Echter wanneer de content van de middelste DIV deze hoogte overschreidt, zouden alledrie en hun container (middle) hun hoogte moeten aanpassen.
Vele dingen geprobeerd maar krijg het niet voor elkaar.
In de voorbeeldcode heb ik linkerdiv en rechterdiv even op 10px vastgezet en laten zien dat de content nu de verticale pixels overschreidt.
Bij voorbaat dank voor het meedenken! Wouter
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style type="text/css">
/***********************************************
* Algemene opmaak
************************************************/
* { margin: 0; padding: 0; border: 0;}
html, body { height: 100%; width: 100%; }
/***********************************************
* Header
************************************************/
#headerline {
position: relative;
width:100%;
height: 30px;
background: yellow;
}
/***********************************************
* Middle
************************************************/
#middle {
position: relative;
width:100%;
min-height:200px;
background: green;
}
/* linkerblok */
#middleleft {
position: absolute;
right:50%;
margin-right: 140px;
top: 0px;
width: 10px;
/* width: 10px als voorbeeld maar hoe kan hier de volledige ruimte links gezet worden? */
min-height:200px;
background: blue;
}
/* middelste blok */
#middlecontent {
position: absolute;
left:50%;
margin-left: -140px;
top: 0px;
width: 475px;
min-height:200px;
background: red;
overflow: visible;
}
/* rechterblok */
#middleright {
position: absolute;
left:50%;
margin-left: 335px; /* -140 + 475 */
top: 0px;
width: 10px;
/* width: 10px als voorbeeld maar hoe kan hier de volledige ruimte links gezet worden? */
min-height:200px;
background: black;
}
</style>
</head>
<body>
<div id="headerline">
</div>
<div id="middle">
<div id="middleleft">
</div> <!-- eind middleleft -->
<div id="middlecontent">
<p>"But I must explain to you how all this mistaken idea of denouncing pleasure and praising pain was born and I will give you a complete account of the system, and expound the actual teachings of the great explorer of the ****h, the master-builder of human happiness. No one rejects, dislikes, or avoids pleasure itself, because it is pleasure, but because those who do not know how to pursue pleasure rationally encounter consequences that are extremely painful. Nor again is there anyone who loves or pursues or desires to obtain pain of itself, because it is pain, but because occasionally circumstances occur in which toil and pain can procure him some great pleasure. To take a trivial example, which of us ever undertakes laborious physical exercise, except to obtain some advantage from it? But who has any right to find fault with a man who chooses to enjoy a pleasure that has no annoying consequences, or one who avoids a pain that produces no resultant pleasure?"</p>
</div> <!-- eind middlecontent -->
<div id="middleright">
</div> <!-- eind middleright -->
</div> <!-- eind middle -->
</body>
</html>
.
... LOL
) maar kom er niet achter.
maar alle cijfertjes kloppen volgens mij.. 
