login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Probleem met divs (Opgelost)

Offline Deloo - 12/08/2011 10:17 (laatste wijziging 12/08/2011 10:25)
Avatar van DelooLid EDIT: Ik heb het nu toch zelf al gevonden De div "main" moest float: left zijn  

------------------------------------------------------------

Ik heb een div "main" met daarin bovenaan een div "menu" en onderaan links een div "content" en rechts een div "sidebar". Zie de onderstaande link om het wat duidelijker te zien.

http://www.ksa-kriko.be/nieuw

Ik heb de "main" een border gegeven om duidelijk te maken waar het over gaat. Alle drie de div's staan in "main" maar toch worden de onderste twee er niet in opgenomen. Hierdoor loopt de schaduw langs de zijkanten niet door.

Ik kan het wel oplossen met meerdere achtergrondafbeeldingen per div maar dan wordt het niet juist weergegeven in IE.

Weet er iemand wat ik over het hoofd zie?

html4strict code - Bekijk de code zonder highlighting - Klap code in 
  1. <div id="main">
  2.   	  		<div id="menu">
  3.         		<ul>
  4.             		<li class="active"><a class="active" href="">Nieuws</a></li>
  5.            	 		<li><a href="">Informatie</a></li>
  6.             		<li><a href="">Leiding</a></li>
  7.             		<li><a href="">Krikojaantje</a></li>
  8.             		<li><a href="">Kalender</a></li>
  9.             		<li><a href="">Media</a></li>
  10.             		<li><a href="">Contact</a></li>
  11.             		<li><a href="">Links</a></li>
  12.             	</ul>
  13.         	</div>
  14.  
  15.   	  		<div id="content">
  16.         		<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ac purus sapien, in fringilla sapien. Proin dui ligula, suscipit vitae posuere in, tincidunt eu
  17.             	lacus. Vivamus id enim leo. Morbi mi nunc, accumsan in pharetra vitae, placerat quis neque. Nullam eget dolor id diam laoreet vestibulum. Aenean dapibus congue 
  18.                 mollis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
  19.         	</div>
  20.         	<div id="sidebar">
  21.         		<h6>Titel Sidebar</h6>
  22.             	<ul>
  23.             		<li><a href="">Item van sidebar</a></li>
  24.                 	<li><a href="">Item van sidebar</a></li>
  25.                 	<li><a href="">Item van sidebar</a></li>
  26.                 	<li><a href="">Item van sidebar</a></li>
  27.             	</ul>
  28.         	</div>
  29.         </div>

css code - Bekijk de code zonder highlighting - Klap code in 
  1. #main {
  2. 	width: 900px;
  3. 	background: url(../images/shadow_repeater.gif) top left repeat-y;
  4. 	border: 1px solid #333;
  5. }
  6.  
  7. #menu {
  8. 	width: 848px;
  9. 	height: 34px;	
  10. 	background: url(../images/menu.gif) top left repeat-x;
  11. 	margin: 0px 26px 0px 26px;
  12. }
  13.  
  14. #content {
  15. 	float: left;
  16. 	width: 598px;
  17. 	text-align: justify;
  18. 	font-size: 0.9em;
  19. 	padding: 10px 20px 0px 40px;
  20. }
  21.  
  22. #sidebar {
  23. 	float: left;
  24. 	width: 200px;
  25. 	padding: 0px;
  26. }


Alvast bedankt!

1 antwoord

Gesponsorde links
Offline vinTage - 12/08/2011 10:36
Avatar van vinTage Nieuw lid Geef aan #main een min-height van 100% toe en plaats een div na sitebar met een clear:both;
Gesponsorde links
Je moet ingelogd zijn om een reactie te kunnen posten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.191s