Nieuw lid |
|
Hallo allemaal,
Ik ben snel een beetje aan een site bezig en ik heb 1 groot probleem hiermede.
Hier heb je a de link.
http://users.te...s/divs.htm
Wat is de bedoeling?
Naarmate de inhoud in het rechter gedeelte langer wordt zou de foto links ook mee naar beneden moeten verschuiven.
Dus de foto moet net boven de footer geplaatst worden.
Hoe kan ik dit doen?
Ik heb al geprobeerd met de positionering van die foto vertical-align:bottom.
Groetjes, MicroWaver
body {
height:100%;
text-align:center;
margin:0px;
padding:0px;
}
#container {
width: 900px;
margin-right: auto;
margin-left: auto;
}
#left {
float:left;
width:261;
position:relative;
background-image:url(images/menu_bg.jpg);
background-repeat:repeat-y;
}
#right {
float:right;
width:639;
position:relative;
}
#content {
background-image:url(images/content_bg.jpg);
background-repeat:repeat-y;
min-height:320px;
}
#picture {
width:100%;
height:100%;
background-repeat:no-repeat;
background-image:url(images/left/left1.jpg);
background-position:50% 100%;
}
body { height:100%; text-align:center; margin:0px; padding:0px; } #container { width: 900px; margin-right: auto; margin-left: auto; } #left { float:left; width:261; position:relative; background-image:url(images/menu_bg.jpg); background-repeat:repeat-y; } #right { float:right; width:639; position:relative; } #content { background-image:url(images/content_bg.jpg); background-repeat:repeat-y; min-height:320px; } #picture { width:100%; height:100%; background-repeat:no-repeat; background-image:url(images/left/left1.jpg); background-position:50% 100%; }
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="divs.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="container">
<div><img src="images/top_lines.jpg"></div>
<div id="left"><img src="images/menu_logo.jpg"><div>[menu]</div><div id="picture"><img src="images/left/left1.jpg" align="absbottom"></div>
</div><div id="right"><img src="images/a-focus_design5_03.jpg"><div id="content">[content]</div></div>
<div><img src="images/footer.jpg"></div>
</div>
</body>
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link href="divs.css" rel="stylesheet" type="text/css"> </head> <body> <div id="container"> <div><img src="images/top_lines.jpg"></div> <div id="left"><img src="images/menu_logo.jpg"><div>[menu]</div><div id="picture"><img src="images/left/left1.jpg" align="absbottom"></div> </div><div id="right"><img src="images/a-focus_design5_03.jpg"><div id="content">[content]</div></div> <div><img src="images/footer.jpg"></div> </div> </body> </html>
|