login  Naam:   Wachtwoord: 
Registreer je!
 Forum

positionering-- absolute en realative probleem (Opgelost)

Offline kasper90 - 20/06/2008 17:34
Avatar van kasper90Nieuw lid Ik heb een probleempje met DIV/CSS gezeik.

Mijn HTML code, is dit:
html4strict code - Bekijk de code zonder highlighting - Klap code in 
  1. <div id="wrapper">
  2. 	<div id="header"><p>Header</p></div>
  3. 	<div id="nav"><p>Nav</p></div>
  4. 	<div id="content"><p>Content</p></div>
  5. </div>


Nou heb ik bij elke id --> position:relative;
Ik wil hiermee bereiken dat elke div relatief aan de #wrapper wordt gepositioneerd, maar mijn browser doet nou heel anders. Hij positioneerd de header precies zoals ik het wil, maar de nav div wordt onder de header gepositioneerd en de content div onder de de nav...
Hoe moet ik dit oplossen?

4 antwoorden

Gesponsorde links
Offline maigel - 20/06/2008 17:38
Avatar van maigel PHP beginner mss dit bij de content div zetten
position: absolute;
left: "breedte van nav"px;
top: "hoogte van header"px;
Offline kasper90 - 20/06/2008 17:45 (laatste wijziging 20/06/2008 17:56)
Avatar van kasper90 Nieuw lid Nee, dat had ik al geprobeerd, maar dan wordt het gepositioneerd relatief van het scherm zeg maar, dus dan komt die helemaal in de linkerbovenhoek terecht...
Offline Martijn - 20/06/2008 18:01
Avatar van Martijn Crew PHP ik denk dat je dan even moet kijken naar floats 
Offline kasper90 - 20/06/2008 18:31 (laatste wijziging 20/06/2008 19:12)
Avatar van kasper90 Nieuw lid Edit:

Ik heb voor elkaar wat ik wil. Het was inderdaad iets met floats. Maar het probleem is dat ik nu nog niet snap waarom het nou allemaal wel werkt. En ik vind het altijd wel handig om te begrijpen wat ik doe.
http://www.meputrecht.nl/mam/index.html

Dit is mijn css nou:
css code - Bekijk de code zonder highlighting - Klap code in 
  1. #wrapper
  2. 	{
  3. 	position: relative;
  4. 	width: 800px;
  5. 	height: 800px;
  6. 	margin-left: auto;
  7. 	margin-right: auto;
  8. 	text-align:left;
  9. 	background-color: red;
  10. 	}
  11.  
  12. #header {
  13. 	width: 800px;
  14. 	height: 100px;
  15. 	background-color: black;
  16. }
  17.  
  18. #nav {
  19. 	position: relative;
  20. 	float: left; 
  21. 	width: 200px;
  22. 	height: 700px;
  23. 	background-color: green;
  24. }
  25.  
  26. #content {
  27.  	position: relative;
  28. 	float: right;
  29. 	width: 600px;
  30. 	height: 700px;
  31. 	background-color: blue;
  32. }


De html code is nog steeds hetzelde.
Ik heb dus de float aangepast. Maar ik vind dit een beetje gek zeg maar, omdat ik gewend ben super veel left en top dingen te gebruiken en dan het uiteindelijk allemaal in elkaar te laten passen. En nu doet die opeens precies wat ik wil, met super weinig code,.
Krijg ik hier geen problemen mee, als ik nog meer div's erbij zou doen enzo.. ?
En als ik het nu wel met left en top enzo zou willen doen, hoe zou ik dat dan moeten doen?
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.174s