[css-postioneren] Doet niet wat ik wil!

[anoniem]

Hoi, Ben bezig *een* site (voor alsnog [url]www.djjc.tk[/url]) om te zetten in CSS. Dit doe ik dan vanaf de grond, en ben nu als eerste begonnen met het bedenken waar het menu, het hoofdgedeelte en het 'top' gedeelte (met logo) komen. Echter, nu wil het niet wat ik wil! De delen komen niet op de juiste plaats, en krijgen ook nog eens niet de juiste achtergrond kleur. Het menu gedeelte en het 'main' gedeelte, komen wel op de goede plek. Maar bij het main gedeelte wordt de text niet links algined (wat ik wel opgeef) en de top krijgt niet de goed achtergrond kleur (blijft zwart). Daarnaast was het eerst (toen ik om de een of andere reden wel achtergrond kleur kreeg) dat het menu en main gedeelte over de top heen vielen. Nouja, hieronder volgt het gedeelte waarin ik de postitie heb aangeven (ik ben nieuw met css, dus mss maak ik een 1 of andere stomme fout): [code:1:7f3dfa653f]#menu { width: 150px; position: absolute; top: 121px; left: 150px; background: #856a57; text-align: left } #main { width: 550px; position: absolute; top: 121px; left: 305px; background: #856a57; text-align: left #top { width: 700px; height: 117px; position: absolute; top: 0px; left: 150px; background: #856a57; }[/code:1:7f3dfa653f] Verder staat [url=www.jochem.elixant.com/djjc/new/bla.htm]hier[/url] de pagina. Alvast bedankt! Jochem

[anoniem]

Je bent de boel vergeten af te sluiten bij #main met een }. Ik denk dat dat al heel veel zou helpen.

[anoniem]

Hey! Bedankt... ik ben gewoon veels te slordig. Meestal zie ik bij html meteen wat ik fout heb gedaan, en waar ik de fout heb zitten. Maar ik ben met CSS dus nieuw, en tja... ik dacht dat ik het goed gedaan had ;). Heel erg bedankt! Jochem

[anoniem]

http://validator.w3.org/ http://jigsaw.w3.org/css-validator/

[anoniem]

Ok... en ik heb weer iets wat niet wil =p. Op [url=http://www.w3schools.com/css/pr_pos_bottom.asp]w3schools[/url] gelezen dat je bij CSS een 'bottom' property heb. Die bepaald de afstand tussen _een_ object en de onderkant. Echter, die krijg ik niet aan de praat. Enig idee of die werkt, en zoniet, hoe ik het dan kan oplossen (mensen hadden het over tables, maar die wil ik juist níét gebruiken). Jochem

[anoniem]

bottom werkt icm position. Maar wat wil je? Als je ruimte wilt creeren aan de onderkant kun je beter margin-bottom gebruiken. Als je ruimte tussen de inhoud en de border wilt creeeren kun je beter padding-bottom gebruiken enz.

[anoniem]

Op dit moment doe ik het volgende: [code:1:d171661b7a]#advertisement { position: absolute; top: 550px; bottom: 50px; left: 50px; right: 50px; width: 150px; background: #FFFFFF; text-align: left; padding: 10px; border: 1px dotted #FFFFFF; bottom: 50px; }[/code:1:d171661b7a] Waarbij de bottom dus niet werkt. Ik wil hetzelfde bereiken als ik met de left en right doe: de afstand tussen zo'n ID en de rand van het venster defineren. Of doe ik dat op deze manier helemaal fout :oops:. Jochem

[anoniem]

Als je de 'width' al weet. Hoef je of 'left' of 'right' al niet meer te specificieren ;-) Daarnaast is de rest wel goed (alhoewel ik me af vraag of je rekening houdt met het verkeerde box model van IE5.x), maar zoveel van [i:88e0f9e58b]die[/i:88e0f9e58b] (top,right,bottom,left) properties is niet goed. Je kunt het beter houden met twee en dan zal het het beste cross-browser werken. Wellicht werkt het ook wel hoor, alleen is het mijzelf nog niet gelukt om in IE de box te laten uitrekken door bijvoorbeeld 'top' en 'bottom' te definieren. Nast bovenstaande hangt het er ook vanaf waar deze box staat en wat de position values zijn van de eventuele omliggende boxes.

[anoniem]

Ok, maar dus met minder specificeren, moet het beter gaan? Dus met links en onder bijvoorbeeld defineren zou het beter gaan? Ik zal eens kijken hoeveel ik weg kan laten, hier is overigens de link naar m'n (nieuwe 8)) hosting (domain komt er zeer binnenkort aan). [url=http://www.greyhoundwebhosting.com/~loseyour/]LINK[/url]. Jochem

[anoniem]

http://css-discuss.incutio.com/?page=ThreeColumnLayouts Gebruik is een doctype ;-) In Mozilla ziet het er nog niet echt uit.

[anoniem]

Ik weet het, en doctype gebruik op dit moment niet (net als meta-tags) omdat het nog een alpha-versie is. Verder weet ik ook dat-ie niet in mozilla werkt, en hoop dat op te lossen door al dat onodige spul eruit te halen... Jochem

[anoniem]

Waarschijnlijk (zeker weten eigenlijk) komt het door onwetendheid, maar een doctype heeft invloed op de manier waarop een browser CSS interpreteert. IE6 in standard compliant mode gebruikt bijvoorbeeld het W3C box model, terwijl IE6 in quirks mode het oude IE5.x box model gebruikt. Zo zijn er nog meer van dat soort dingen. Lijkt me iets om rekening mee te houden ;-)

[anoniem]

[url]http://www.thenoodleincident.com/tutorials/box_lesson/boxes.html[/url]