Uitlijnen div's

Status
Niet open voor verdere reacties.
E

ErnstM

Gebruiker
Lid geworden
28 jan 2007
Berichten
32
Hey, ik heb even een vraag.
Op mijn website maak ik gebruik van div's.
Boven op mijn website zit een menu. Onderin staat wat informatie (die moet ook perse onderaan staan). Dat werkt allemaal prima... Maar als je de scherminstelling gaat veranderen wordt het oppeens drama. Dan verschijnt de informatie die op mijn instelling(1024 x 768) onderin staat, inneens iets onder het midden.

Nu is mijn vraag, kan je een div verticaal uitlijnen mbv procenten? Ik heb wel het een en ander geprobeerd (en gezocht op google) maar ik kan dé oplossing nog niet vinden.

bvd!
 
heb je een linkje? snap niet helemaal wat je precies bedoelt....
container div's willen nog wel eens helpen
 
Hier was de link van hoe de pagina er nu uitziet. Je zal zien dat de blokken met de tekst "blokje met info" nu onderaan staan (bij een scherminstelling van 1024 x 768). Als je de scherminstelling groter maakt (kleiner maakt me niks uit) dan verschijnen de blokken ergens halverwege de pagina al (ligt natuurlijk weer aan je scherminstellingen, hoe groter, hoe hoger de blokken staan).

Nu wil ik graag, dat de blokken altijd onderaan de pagina staan! Oftwel hoe kan je een div verticaal uitlijnen mbv procenten.

Hier is de code van de css:
HTML: 
body {
	background: #1e1e1e;
	font-family:   	 sans-serif;
	line-height: 1.2;
 	margin: 0px;
 	color: #AAAAAA;
 	text-shadow: 0 0 0 #000;
 	

}

a 	{color: #aaaaaa; text-decoration: none; font-size: 16px; font-weight: bold; }
a:hover {color: #FFFFFF; }

#titel {
	float: right;
	margin-top: 10px;
	margin-right: 10px;	
	font-family: "Trebuchet MS", Helvetica, Arial;
	color: #aaaaaa;
	font-size: 16px;
	
}


#balk{
	
	height: 5px;
	background: #05589C;
	
}

#keuze {
	font-size: 12px;
	margin-top: 10px;
	margin-left: 10px;
	float: left;
		
}



#lijn{

background-image:url(lijn.bmp);
background-repeat: repeat-x;
height: 15px;
margin-top: 30px;
width: 100%;

	}
	
#lijn2{

background-image:url(lijn.bmp);
background-repeat: repeat-y;
height: 120px;
float: left;
width: 15px;
	
	}
	
#vak1{
	
	float:left;
	margin-left: 10px;
	margin-top: 10px;
	width: 200px;
	height: 120px;
	
	
	}	
	

h1{
	font-size: 15px;
}

#logo{
	float: center;
	margin-top: 100px;
	
}

En dan is de code van de pagina:
HTML: 
<html>
<head>
   		 
  		<title>Helpmij voorbeeld</title>
   		<link rel='stylesheet' type='text/css' media='all' href='opmaak.css' />
      


</head>

<body>
		<div id='balk'>
		</div>
		
		<!-- Begin div keuze -->
		<div id='keuze'> 
		<a href='helpmij.html'>Home</a>&nbsp;
		<a href='helpmij.html'>Pagina 1</a>&nbsp;
		<a href='helpmij.html'>Pagina 2</a>&nbsp;
		<a href='helpmij.html'>etc.</a>&nbsp;
	

		</div><!-- einde div keuze -->
		
		<!-- Begin div titel -->
		<div id='titel'> 
		<b>Helpmij voorbeeld site</b>

		</div><!-- einde div titel -->
		

	
		<div id='logo'>  
		
		<center><img src='palm.JPG' title='Plaatje' />
		
		</div>
		

		
		<div id='lijn'></div>
		
		
		<div id='vak1'>Blokje met info</div>		
		<div id='lijn2'></div>
		
		
		<div id='vak1'>Nog een blokje met info</div>
		<div id='lijn2'></div>
		
		
</body>
</html>
 
Laatst bewerkt:
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan