Vraag & Antwoord

Webdesign (HTML, CSS, Flash)

Positie van <div> niet correct.

10 antwoorden
  • Beste mensen, Ik bezig met een website en nu heb ik het probleem dat mijn div's niet op de juiste plaats komen te staan. En ik heb veel geprobeerd en heb wel een oplossing met die is niet prakties. Hoe kan ik het beste div's de juiste positie mee geven. Mijn idee is als volgt. [code:1:579d0177a3] <div id="sitecontainer"> <div id="header"></div> <div id="main"> <div id="links"> </div> <div id="midden"> </div> <div id="rechts"> </div> </div> <div id="onder> </div> </div> [/code:1:579d0177a3] Dus alles komt in de sitecontainer. Dan boven in de sitecontainer de header. Daaronder links een div, in het midden een div, en rechts een div. En daaronder dan nog een div. Iemand een idee? Heb al rond gekeken, voor het in het midden van de site ben ik er al uit, alleen blijf nog steken op dit punt. Al vast bedankt. Jordy Edit: Op [url=http://www.jonrust.nl]mijn website[/url] kun je zien wat ik bedoel.
  • Je hebt geen floats voor de drie middelste div gedefinieert. Probeer het eens met een float:left; voor alle drie. Verder zie ik dat je ID's meerdere malen gebruikt. Voorbeeldje: [code:1:7314a49da6] <li class="menu" id="menu_link"> <a href="index.php" class="menu">Home</a> </li> <li class="menu" id="menu_link"> <a href="gastenboek.php" class="menu">Gastenboek</a> </li> <li class="menu" id="menu_link"> [/code:1:7314a49da6] Een ID kun je slechts een keer gebruiken. Het is beter om daar classes voor te gebruiken. Verder kloppen je breedtes volgens mij niet. Ik heb even in je stylesheet zitten rekenen en kom tot de volgende uitkomst: content sitecontainer: 800px breed header 800px breed + 2*2px border = totaal 804px breed linker div 99px breed + padding-left 5px + 2*1px border = 106px breed midden div 550px breed + padding-left 25px + padding-right 25px + 2*1px border = 602px breed rechter div 95px breed + padding-left 5px + padding-right 5px + 2*1px border = 107px breed 3 divs gezamelijk: totaal 815px breed Je maakt dus eerst een maincontainer die 800 pixels ruimte geeft in de breedte Dan stop je daar een header in van 804 pixels breed en daarna 3 divs die samen 815 pixels nodig hebben. Meer uitleg: http://www.webstandaarden.org/standaarden/browsers_box_models.php (De pagina handelt ook over het box-model probleem van IE, maar je gebruikt een correct doctype en ik weet sinds kort dat dit IE probleem dan niet van toepassing is. Dat kun je dus negeren. Het gaat met name over het stukje: 'Hoe het Box Model werkt')
  • Als ik float gebruik plaatst hij die div's buiten de site container. En wat je zegt over de breedtes klopt. Alleen het gekke vind ik dat mijn header er atlijd wel in staat. Maar ik zal nog even aan het puzzelen gaan. Al vast bedankt. Edit: De borders voor de div's binnen de sitecontainer zijn btw om het beter zichtbaar te maken waar de div's staan.
  • [quote:b7d9a92187="Bright"]Als ik float gebruik plaatst hij die div's buiten de site container. [/quote:b7d9a92187] Het zou kunnen dan je de overflow van de sitecontainer nog moet aanpakken. (Overflow:hidden; of zoiets)
  • Ik ben inmiddels al een stukje verder. Ik kreeg vn een vriend van mij de [url=http://css.maxdesign.com.au/floatutorial/tutorial0916.htm]volgende link[/url]. Na het lezen van deze tutorial kwam ik al een heel stuk verder. Het resultaat kun je [url=http://www.jonrust.nl]hier zien[/url]. Alleen nu wordt mijn rechter div onder die van de anderen geplaatst. Alle div's staan inmiddels op de goede plekk behalve die rechter div. Deze moet omhoog. Wat zie ik over het hoofd?
  • Ik ben er inmiddels uit. Ik moest de div voor de rechterkant voor mijn midden div plaatsen. Nou werkt het. In elkgeval bedankt.
  • Als je nou geen zin hebt in veel gedoe mbt de allereerste opzet kan je altijd [url=http://www.code-sucks.com/css%20layouts/]hier[/url] kijken of er een layout tussen zit dat je aan staat, dan kan je die layout verder aanpassen aan je eigen wensen (er zijn ook nog wel [url=http://layouts.ironmyers.com/]andere sites[/url] met dit soort "kant-en-klare" jayouts).
  • [quote:52dacbb0e1="Drewster"]Als je nou geen zin hebt in veel gedoe mbt de allereerste opzet kan je altijd [url=http://www.code-sucks.com/css%20layouts/]hier[/url] kijken of er een layout tussen zit dat je aan staat, dan kan je die layout verder aanpassen aan je eigen wensen (er zijn ook nog wel [url=http://layouts.ironmyers.com/]andere sites[/url] met dit soort "kant-en-klare" jayouts).[/quote:52dacbb0e1] Briljante links! (Kende ik iig nog niet...) Staan ze al in de [url=http://forum.computertotaal.nl/phpBB2/viewtopic.php?t=185944]Best Practices[/url]? ;) - Bas
  • Daar staan ze nog niet in nee, als je je geroepen voelt, be my guest ;).
  • [quote:722d270335="Drewster"]Als je nou geen zin hebt in veel gedoe mbt de allereerste opzet kan je altijd [url=http://www.code-sucks.com/css%20layouts/]hier[/url] kijken of er een layout tussen zit dat je aan staat, dan kan je die layout verder aanpassen aan je eigen wensen (er zijn ook nog wel [url=http://layouts.ironmyers.com/]andere sites[/url] met dit soort "kant-en-klare" jayouts).[/quote:722d270335] Geweldig! je bent een held :D

Beantwoord deze vraag

Weet jij het antwoord op deze vraag? Registreer of meld je aan met je account

Dit is een gearchiveerde pagina. Antwoorden is niet meer mogelijk.