login  Naam:   Wachtwoord: 
Registreer je!
 Forum

DIV probleem positie

Offline DrB - 17/09/2007 19:29 (laatste wijziging 17/09/2007 19:29)
Avatar van DrBHTML interesse
php code - Bekijk de code zonder highlighting - Klap code in 
  1. #contentlinker {	
  2. 	float:left;
  3. 	width: 559px;
  4. 	height: 350px;
  5. 	background-color:#f1f7f7;
  6. 	border-left:1px solid #868a89;
  7. 	border-bottom:1px solid #868a89;
  8. }
  9.  
  10.  
  11.  
  12. #contentrechter {	
  13. 	text-align:left;
  14. 	float:left;
  15. 	width: 339px;
  16. 	height: 350px;
  17. 	background: url(../img/profiel.gif) no-repeat;
  18. 	border-right:1px solid #868a89;
  19. 	border-bottom:1px solid #868a89;
  20. }



HTML:

php code - Bekijk de code zonder highlighting - Klap code in 
  1. <div id="contentlinker"></div>
  2. <div id="contentrechter"></div>



Bovenstaande moet ervoor zorgen dat "contentlinker" naast "contentrechter" komt. Dit werkt prima in Firefox en de nieuweste IE, maar in IE 6 komt contentrechter onder contentlinker te staan. Waarom?

5 antwoorden

Gesponsorde links
Offline marten - 17/09/2007 23:05
Avatar van marten Beheerder Omdat je div's waarschijnlijk te groot zijn voor het scherm?
Offline Orves - 18/09/2007 08:18 (laatste wijziging 18/09/2007 08:18)
Avatar van Orves Nieuw lid Haal van beiden divs 1 pixel af en dan zou het moeten werken in alle browsers. Dit komt omdat je een border om je divs hebt gezet welke aan weerszijden een pixel in beslag nemen [in IE] en 1 + 1 is nog steeds 2 en jij hebt aan je CSS te zien rekening gehouden met 1pixel.

Probeer het eens uit en anders kun je in de html,body declaratie het volgende zetten

css code - Bekijk de code zonder highlighting - Klap code in 
  1. html,body {
  2.   min-width: 100%;
  3. }
Offline DrB - 18/09/2007 14:07 (laatste wijziging 18/09/2007 14:15)
Avatar van DrB HTML interesse Nee daar heeft het niet mee te maken volgens mij... Tel de width maar eens op dan kom je op 898 px, dus 2 pixels over gehouden voor de border links en rechts.

Div links heeft een border links en Div rechts een border rechts. Dat zijn dus twee borders van 1 pixels wat 2 maakt. 898 + 2 = 900

Maar wat jij zegt is dat IE van die ene pixel aan 1 kant er twee maakt? IE 6 dan..

Het probleem is dat ik alleen mn sites kan testen op school in IE 6..
Offline Basman - 18/09/2007 14:17
Avatar van Basman Nieuw lid Hm, als ik de code overneem en in IE6 bekijk, staan ze keurig naast elkaar
Offline DrB - 19/09/2007 14:34 (laatste wijziging 19/09/2007 14:35)
Avatar van DrB HTML interesse Boven die 2 divs heb ik een horizontale div van 900 px breed. Deze geef ik float:left; mee. Als ik float:left; weghaal dan is het goed, maar dan verdwijnt die horizontale div.

Schets:

111111111111111111111111111
111111111111111111111111111
222222222222233333333333333
222222222222233333333333333
222222222222233333333333333


1 is de horizontale div
2 de linkerdiv
3 de rechter div


code van de horizintale div:

php code - Bekijk de code zonder highlighting - Klap code in 
  1. #infobalk {	
  2.         float:left;
  3. 	width: 898px;
  4. 	height: 28px;
  5. 	background-color:#e5eded;
  6. 	border-left: 1px solid #818585;
  7. 	border-right: 1px solid #818585;
  8. }



Als ik float:leftl weghaal zijn de linker en rechter div goed in IE, maar dan verdwijnt de infobalk div.
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.194s