login  Naam:   Wachtwoord: 
Registreer je!
 Forum

divs

Offline bitefreak - 25/05/2008 17:55
Avatar van bitefreakNieuw lid hey ik heb een vraagje,

wat ik zou willen is een container div waarin 4 divjes komen.

1 voor het logo dan 10 px onder het logo een div met het menu daar 10 px naast een div voor content en onder die 2 divs een div voor de foot. hoe kan ik dit het besten doen ? ben heel de tijd al bezig werkt het 1 dan werkt het ander weer niet.

4 antwoorden

Gesponsorde links
Offline zointer - 25/05/2008 19:08
Avatar van zointer HTML gevorderde staat hier al uitgelegd
Offline Martijn - 25/05/2008 19:08 (laatste wijziging 25/05/2008 19:11)
Avatar van Martijn Crew PHP als alles vaste groottes is is dit een optie:

  1. body,html{width: 100%;} /* anders snapt IE het niet*/
  2.  
  3. div#container{
  4. position: relative;
  5. width: 600px;
  6. height: 600px;
  7. margin 0px auto; /* zet je pagina in het midden */
  8. }
  9.  
  10. div#logo{
  11. position: absolute;
  12. top: 0px; /*Hoe ver vanaf boven moet ie beginnen */
  13. left: 0px; /* hoe ver vanaf links moet die beginnen */
  14. width: 100%; /* Kan ook in pixels, bv je menu */
  15. height: 50px;
  16. }

als je dus iets 10px onder je banner wilt, moet je kijken hoe groot je banner is +10px als top geven 

gebruik:
  1. <div id="container">
  2. <div id="logo"> Logo hier</div>
  3. </div>
Offline bitefreak - 25/05/2008 20:25
Avatar van bitefreak Nieuw lid hey zover had ik het ook al

maar als ik de header heb en het menu en het content lukt het nog maar zodra ik er een foot onder wil zetten gaat het mis.

die plakt zijn eigen iedere keer onder het content terwijl het menu verder uitrijkt naar beneden vanwege de inhoud
Offline Martijn - 25/05/2008 22:55 (laatste wijziging 25/05/2008 22:56)
Avatar van Martijn Crew PHP volgens mij kun ook doen:
  1. div#menu{
  2. position: absolute;
  3. width: 100px;
  4. height: 10px;
  5. left: 0px;
  6. top: 110px; /* vanuitgaat header=100 +10px ruimte */
  7. bottom: 10px;
  8. }

en dan geen heigth meegeven.
en dan een footer:
  1. div#footer{
  2. position: absolute;
  3. width: 100%;
  4. left: 0px;
  5. bottom: 0px;
  6. text-align: center;
  7. }
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.364s