login  Naam:   Wachtwoord: 
Registreer je!
 Forum
Zoeken  Regels  Help
Categorieën > HTML & CSS

footer div centeren (Opgelost)

chth – 08/05/2011 14:32
Offline offline




Lid
 hallo allemaal,

ik zou graag hebben dat men footer onderaan de pagina blijft en zich centreert zodat deze onder de content div komt te staan

ik gebruik deze html code:
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3.  
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="nl" lang="nl">
  6.  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  7.  <meta name="description" content="beschrijving van de webpagina" />
  8.  <meta name="keywords" content="trefwoorden, gescheiden, door, komma's" />
  9.  <link rel="stylesheet" href="index.css" type="text/css" />
  11.  titel webpagina
  13. </head>
  15. <div id="sitecontent">
  16.  <div id="content">
  17.  
  18.  </div>
  19. </div>
  20. <div id="footer">
  21. footer
  22. </div>
  23.  
  24. </body>
  25. </html>



en volgende css code:
  1. html{
  2. 	margin: 0;
  3. 	padding:0;
  4. 	height: 100%;
  5. }
  6.  
  7. body{
  8. 	margin: 0px;
  9. 	padding: 0px;
  10.  
  11. }
  12.  
  13. div#sitecontent	{
  14.  
  15. }
  16.  
  17. div#content	{
  18. 			border: black 1px solid;
  19. 			width: 800px;
  20. 			height: 400px;
  21. 			margin-top: 30px;
  22. 			margin-left: auto;
  23. 			margin-right: auto;
  24. }
  25.  
  26. div#footer	{
  27. 			border: black 1px solid;
  28. 			margin-left: auto;
  29. 			margin-right: auto;
  30. 			bottom: 0;
  31. 			position: absolute;
  32. 			width: 800px;
  33. 			font-size: xx-small;
  34. 			clear: both;
  35.  
  36. }



kan iemand me helpen zodat de footer-div onder de content-div komt te staan

alvast bedankt

6 antwoorden

Gesponsorde links

WouterPSV – 08/05/2011 16:45
Offline offline



Lid
Heb je hier wat aan ?
http://www.cssstickyfooter.com/

peerke59 – 08/05/2011 17:07
Offline offline



MySQL interesse
Probeer het eens uit met de width van je footer niet op 800px te houden.
Je kan verder ook nog de footer left/right aan te passen.
Een beetje uitproberen met de waardes kan al veel verschil geven.

chth – 09/05/2011 21:26
Offline offline



Lid
nee, ik heb dit geprobeerd maar dit werkt echter niet .

en de css stickyfooter help ook niet

lolll – 09/05/2011 21:40 (Laatst gewijzigd op 09/05/2011 21:41)
Offline offline



Lid
Heb je een online vb van wat je nu hebt? Zodat we weten hoe het er nu uitziet, want wat gaat er nu eigenlijk fout?
Het zou ook helpen om 1 container div te centreren en daarin je content en footer te zetten. Die container geef je dan position relative, zodat je de footer met absolute (zoals je nu al hebt staan) op de bottom kunt uitlijnen. De fout nu is dat je nergens een relative hebt staan.

Lolll

WouterPSV – 10/05/2011 22:15
Offline offline



Lid
Volgens mij is dit wat je bedoeld ;)

Here you Go :

Plaatscode: 141010

chth – 11/05/2011 21:18
Offline offline



Lid
 inderdaad, dat wou ik hebben.
bedankt ;)

Gesponsorde links

Je moet ingelogd zijn om een reactie te kunnen posten.
Actieve forumberichten:

© 2002-2012 Sitemasters.be - Regels - Gehost door: Vircon - Laadtijd: 0.047s