login  Naam:   Wachtwoord: 
Registreer je!
 Forum

FireFox pakt de div-layout niet zoals het hoort

Offline ivan_1987 - 01/04/2008 19:55 (laatste wijziging 01/04/2008 21:05)
Avatar van ivan_1987Nieuw lid Hallo,
Ik ben bezig met een website gelay-out met divs. In IE(7) doet hij precies wat ik wil. Maar FF pakt de CSS niet juist.
Het probleem zit 'm in de divs die niet binnen de "container" willen align-en. ik heb laten we zeggen een 3-kolommen-layout en de drie divs komen uit de container div te staan.

Ik gebruik hier een xHTML strict DTD als je het wil weten.

Zie de code hieronder:
  1. <div id="uppermenu">
  2. <ul>
  3. <li><a href="index.php">Home</a></li>
  4. <li><a href="index.php?pg=2">Biography</a></li>
  5. <li><a href="index.php?pg=3">Contact</a></li>
  6. <li><a href="index.php?lang=en">English</a></li>
  7. </ul>
  8. </div>
  9. <div id="container">
  10. <div id="aboveHeader"></div>
  11.  
  12. <div id="header"></div>
  13.  
  14. <div id="friendsites">
  15. <legend>Writings on other websites</legend>
  16. <ul>
  17. <li><a href="">Somelink</a> | </li>
  18. </ul>
  19. </div>
  20.  
  21. <div id="contentcontainer">
  22. <div id="leftmenu">
  23. this is left
  24. </div>
  25.  
  26. <div id="content">
  27. <div id="pagetitle"></div>
  28. <div id="pagetxt"></div>
  29. this is content
  30. </div>
  31.  
  32. <div id="rightmenu">
  33. this is right
  34. </div>
  35. </div>
  36. </div>


De css voor dit html gedeelte is als volgt:
Plaatscode: 6405

Ik weet dat het een lange stuk code is maar alles is practisch hetzelfde.. Ziet iemand waarom die "leftmenu", "content", "rightmenu" uit de "contentcontainer" en ook uit de "container" komen te staan in FF???

Alvorens bedankt.

9 antwoorden

Gesponsorde links
Offline nathanael - 01/04/2008 19:58
Avatar van nathanael Gouden medaille

HTML gevorderde
je moet nog position: absolute of relative toevoegen

en BTW: lange stukken code plaats je in pastebin
Offline ivan_1987 - 01/04/2008 20:02
Avatar van ivan_1987 Nieuw lid Ik heb in de "contentcontainer", "leftmenu", "content", "rightmenu" beide mogelijkheden geprobeerd en het werkt niet.
als ik absolute invul dan gaan alle divs over elkaar. als ik relative invul dan is het probleem niet opgelost in firefox.

sorry voor de langs stuk code zal volgende keer aan denken.

iemand een andere suggestie?
Offline gothmog - 01/04/2008 21:04
Avatar van gothmog Lid Wat wil niet alignen?
Welke divs komen niet goed?
Offline ivan_1987 - 03/04/2008 17:53 (laatste wijziging 03/04/2008 17:53)
Avatar van ivan_1987 Nieuw lid de divs die niet willen align-en zijn leftmenu, content en rightmenu 

Enig idee waarom!?
Offline Simax - 03/04/2008 19:38
Avatar van Simax Onbekend Je wilt 3 divjes langs elkaar(horizontaal)?
Offline ivan_1987 - 03/04/2008 23:05 (laatste wijziging 03/04/2008 23:19)
Avatar van ivan_1987 Nieuw lid Ja, Spot  
ze moeten binnen de grote container voor de content, die weer in een container van de hele site zit. zoals de code laat zien!

Dit is niet de eerste keer dat ik dit gebruik .. en het heeft altijd al gewerkt.. als ik maar 1 container gebruik .. en nu wil het nergens lukken... wat me een grote lading frustratie brengt moet ik eerlijk zegge...  
Offline Simax - 04/04/2008 00:08 (laatste wijziging 04/04/2008 00:19)
Avatar van Simax Onbekend Probeer dit eens..
  1. <div class="container">
  2. <div class="left"></div>
  3. <div class="content"></div>
  4. <div class="right"></div>
  5. </div>
Offline ivan_1987 - 07/04/2008 08:31 (laatste wijziging 07/04/2008 09:40)
Avatar van ivan_1987 Nieuw lid Spot, Het werkt ook niet als ik jouw code gebruik. Ik vraag me af wat nou eigenlijk het probleem is: de css/html of de browser ondersteuning!? want in IE doe hij het perfect.
In opera doet hij het ook niet dus zit ik echt enorm te twijfelen of er een andere manier is om die drie-kolom lay-out te krijgen met divs??

iemand een idee?

PS.: waaaaarom resizet de content div nou niet in hemelsnaam... !!!!!
-------------------------------------------------------------------

IK HEB EEN OPLOSSING GEVONDEN!!!
Voor de mensen die het willen weten: ik heb gegoogld en uiteindelijke een verstandige geest gevonden die mij kon uitleggen wat het probleem is.
Het komt namelijk doordat ik met objects float. een mogelijke oplossing hiervoor is als volgt:
Maak een nieuwe "class" aan genaamd "clear" bijvoorbeeld (elke andere naam is mogelijk natuurlijk)
  1. .clear
  2. {
  3. clear: both;
  4. }


Dan maak je nog een div in je lay-out aan ONDER/na je floating divs. als je de floating divs in een "eigen" container hebt dan moet je die clear-div ook binnen die container onder/na je divs doen.
  1. <div class="clear"></div>
Offline Ibrahim - 08/04/2008 09:02
Avatar van Ibrahim PHP expert KLIK DAN OP DE OPLOS KNOP!!!
Voor de TS die het wil weten: oplos knop is er niet voor niks...
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.174s