Hallo,

Ik probeer een site te basen maar 1 ding lukt niet. Het gaat om deze layout:
http://i43.tinypic.com/zsl2sg.jpg

Ik kom met basen zover:
http://i42.tinypic.com/4vol7o.jpg


Dit is de HTML en CSS code:

CSS:

Code:

div#container 
       { 
        width: 729px;
		height: 418px;
		margin-left: 225px;
		background-color: #ffffff;
    } 

div#lbContainer 
    { 
        background: url('images/images/lb.gif'); 
        width: 162px;
		height: 185px;
        margin-left: 10px; 
		margin-top: 8px;
        float: left; 
    } 
	
div#loContainer 
    { 
        background: url('images/images/lo.gif'); 
        width: 162px;
		height: 184px; 
		margin-left: 10px;
		margin-top: 25px;
		clear: left;
        float: left; 
    } 

div#mbContainer 
    { 
		background: url('images/images/mb_wit.gif'); 
        width: 429px;
		height: 341px; 
		margin-left: 183px;
		margin-top: 0px;
        float: none; 
    } 

div#moContainer 
    { 
		background: url('images/images/mo.gif'); 
        width: 426px;
		height: 56px; 
		margin-left: 184px;
		margin-top: 6px;
        float: none; 
    } 
div#rContainer 
    { 
		background: url('images/images/rechts.gif'); 
        width: 105px;
		height: 395px; 
		margin-right: 8px;
		margin-top: 6px;
        float: right;
    }

HTML:

Code:

	<div id="container">                 
			<div id="lbContainer"></div>
			<div id="loContainer"></div>
			<div id="mbContainer"></div>
			<div id="moContainer"></div>
			<div id="rContainer"></div>
	</div>

Zoals je ziet in Container het witte vlak en daarin zitten die 5 menu's

Nu wil ik rechts nog die lange balk basen maar hij kan niet omhoog. Het lijkt erop dat het geblokkeerd is door die linker menu's. Wat moet ik doen?

MvG Freek

LO= Linksonder
LB: Linksboven
MB= Middenboven
MO= Middenonder
R= Rechts.

float:left; i.p.v. float:right?

Had ik al geprobeerd, dan kan ik hem met margin-left wel op zijn plek krijgen qua horizontale positie maar als ik hem omhoog wil zetten komt hij weer niet verder dan de onderkant van die andere menu's

Als je hem nou gewoon eens online zet, nu moeten wij in de code wat gaan zoeken e.d.

http://www.angkete.nl/mapje/index.html

Je moet gewoon even 3 containers maken en die allemaal float: left; geven en dan de content er in, heb je nergens last van. Niet vergeten daarna een div met clear: left/both; te gebruiken.

Je kan beter overnieuw beginnen, want dit ziet er niet uit.

Wat ik altijd doe, drie kolommen: kolom-links (float left) kolom-midden(float left) en kolom-rechts(float right)

En daar kan je dan al die elementen in zetten.

Ben het nog aan het leren dus ben "blij" met jullie kritiek. Maar alexander, in die 3 kolomen zet je dan die vakken. Dus dat je bij de eerste kolom zoeits hebt met HTML:

<div id="kolom-links">
<div id="Boven"></div>
<div id="onder"></div>
</div>

ja, inderdaad.

Ik heb het even opnieuw gedaan, nu helemaal crossbrowser en nog steeds Xhtml valid.
http://www.angkete.nl/designerswereld/index.html

Ik zou alleen nog body{ overflow: hidden; } weghalen.