login  Naam:   Wachtwoord: 
Registreer je!
 Forum

div automatisch groeien naar beneden probleem!

Offline billyboy - 12/01/2009 12:41
Avatar van billyboyNieuw lid Beste mensen,

Ik heb een probleem met de layout van mijn webpagina. Ik krijg het maar niet voor elkaar om een div (id=left_menu2, blauwe lijn) automatisch te laten groeien naar beneden zo groot als het venster is.
Wie kan me helpen, ik heb al vanalles geprobeerd.

html4strict code - Bekijk de code zonder highlighting - Klap code in 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  4. 	<TITLE>webpage</TITLE>
  5. 	<STYLE title=currentStyle type=text/css media=screen>
  6. 		/* basic elements */
  7. 		html {
  8. 			margin: 0;
  9. 			padding: 0;
  10. 			height: 100%;
  11. 			}
  12. 		body { 
  13. 			margin: 0; 
  14. 			padding: 0;
  15. 			height: 100%;
  16. 			width: 100%;
  17. 			}
  18.  
  19.  
  20. 		/* specific divs */
  21. 		#container { 
  22. 			width:  100%;
  23. 			height: 100%;
  24. 			margin: 0; 
  25. 			border: 1px dotted black;
  26. 			}
  27.  
  28. 		#left_container { 
  29. 			width: 180px;
  30. 			height: 100%;
  31. 			float: left;
  32. 			border: 1px dotted red;
  33. 			}
  34.  
  35. 		#header {
  36. 		  display: block;
  37. 		  width: 180px;
  38. 		  height: 200px;
  39. 		}
  40.  
  41. 		#top_logo {
  42. 			width: 180px;
  43. 			height: 60px;
  44. 		}
  45.  
  46. 		#left_menu_container {
  47. 			width: 180px;
  48. 			border: 1px dotted green;
  49. 		}
  50.  
  51. 		#left_menu1 {
  52. 			background: transparent url(./pictures/menuleft.jpg) no-repeat top left;
  53. 			width: 180px;
  54. 			height: 260px;
  55. 		}
  56.  
  57. 		#left_menu2 {
  58. 			background: transparent url(./pictures/backleft.jpg) repeat-y top left;
  59. 			width: 180px;
  60. 			border: 1px dotted blue;
  61. 		}
  62.  
  63. 		#right_container {
  64. 		 }
  65.  
  66. 		#top_menu {
  67. 			background: transparent url(./pictures/head.jpg) repeat-x top left;
  68. 			height: 150px;
  69. 		}
  70.  
  71. 		#right_sub_container {
  72. 		}
  73.  
  74. 		#left_selector_container {
  75. 			width: 90px;
  76. 			margin-bottom: 0px;
  77. 			float: left;
  78. 		}
  79.  
  80. 		#left_selector1 {
  81. 			background: transparent url(./pictures/menuright8.jpg) no-repeat top left;
  82. 			width: 90px;
  83. 			height: 450px;
  84. 		}
  85.  
  86. 		#left_selector2 {
  87. 			background: transparent url(./pictures/backright.jpg)  repeat-y top left;
  88. 			width: 90px;
  89. 			margin-bottom: 0px;
  90. 		}
  91.  
  92. 		#content_container {
  93. 		}
  94. 	</STYLE>
  95. </HEAD>
  96.  
  97. <BODY id=css-xyztec>
  98. <DIV id=container>
  99. 	<DIV id=left_container>
  100. 		<DIV id=header>
  101. 		</DIV>
  102. 		<DIV id=top_logo>
  103. 		</DIV>
  104. 		<DIV id=left_menu_container>
  105. 			<DIV id=left_menu1>leftmenu
  106. 			</DIV>
  107. 			<DIV id=left_menu2><p>Best viewed in 1024x768</p>
  108. 			</DIV>
  109. 		</DIV>
  110. 	</DIV>
  111. 	<DIV id=right_container>
  112. 		<DIV id=top_menu>
  113. 			topmenu
  114. 		</DIV>
  115. 		<DIV id=right_sub_container>
  116. 			<DIV id=left_selector_container>
  117. 				<DIV id=left_selector1>
  118. 				</DIV>
  119. 				<DIV id=left_selector2>
  120. 				</DIV>
  121. 			</DIV>
  122. 			<DIV id=content_container>
  123. 				content_container
  124. 			</DIV>
  125. 		</DIV>
  126. 	</DIV>
  127. </DIV>
  128. </BODY>
  129. </HTML>

4 antwoorden

Gesponsorde links
Offline shonda - 12/01/2009 12:49 (laatste wijziging 12/01/2009 12:50)
Avatar van shonda Lid Er een min-height: hoogtepx van maken.
Dan verandere je hoogte in de standaard hoogte.
Offline billyboy - 12/01/2009 13:24
Avatar van billyboy Nieuw lid jammer, net geprobeert maar dat werkt ook niet.
Offline shonda - 12/01/2009 14:51
Avatar van shonda Lid Heb je ook geprobeerd om ook min-height op de divs: left_container && left_menu2 && left_menu1 ?
Offline WouterPSV - 12/01/2009 15:14
Avatar van WouterPSV Lid Plaatscode: 67649

Alleen nu is die goed voor 1024 x 768 zoals er staat best viewed. Ik krijg het niet goed met de % . hoop je iig stukje op weg te hebben geholpen
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.167s