anoniem Geplaatst: 17 februari 2003 Delen Geplaatst: 17 februari 2003 Is het mogelijk - en zo ja: hoe? - om met CSS een pagina te centreren? Wat ik namelijk wil is het volgende: een div met een vaste breedte in het midden van de pagina. Zou je met frames [b:30e1099edd]*,750,*[/b:30e1099edd] gebruiken, in CSS is het niet mogelijk om een ruimte 'op te vullen', toch? En als je de body de eigenschap [b:30e1099edd]text-align: center[/b:30e1099edd] meegeeft werkt dit prima, totdat (!) je de div een breedte meegeeft, ongeacht absoluut of relatief. De div wordt dan niet langer gecentreerd weergegeven maar links. (In ieder geval in Netscape.) Wat ook nog mogelijk is, is om de div tussen [b:30e1099edd]<center>[/b:30e1099edd] en [b:30e1099edd]</center>[/b:30e1099edd] te zetten maar ook dit gaat niet door omdat het niet geldig XHTML Strict is. Dus mijn vraag: hoe dit op te lossen? - Bas Quote Link naar reactie
anoniem Geplaatst: 17 februari 2003 Auteur Delen Geplaatst: 17 februari 2003 misschien is dit wat: [url=http://members.lycos.nl/djamn/juliussteiner/flash.php]klik[/url] grtzz. Quote Link naar reactie
anoniem Geplaatst: 17 februari 2003 Auteur Delen Geplaatst: 17 februari 2003 Leuk geprobeerd (en zeer handig), maar deze vlieger gaat nu niet op. Probeer maar eens layer "main" een vaste breedte te geven en je zult precies zien wat ik bedoel. Er staat niet voor niets "breinbreker!" ;) - Bas Quote Link naar reactie
anoniem Geplaatst: 17 februari 2003 Auteur Delen Geplaatst: 17 februari 2003 Zet margin-left en margin-right op auto voor Mozzilla en gebruik text-align voor IE. /E Quote Link naar reactie
anoniem Geplaatst: 17 februari 2003 Auteur Delen Geplaatst: 17 februari 2003 en het in een ander div zetten? [code:1:00c612f32b]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" > <head> <title>test</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <body style="margin: 0;> <div id="main" style="width:100%; text-align: center;"> <div id="content" style="width: 400px; border: 1px solid black;">test</div> </div> </body></html>[/code:1:00c612f32b] Dit werkt in IE6, maar ik heb geen NS op mijn werk dus kan ik dat nu niet voor je controleren of dat ook werkt. Quote Link naar reactie
anoniem Geplaatst: 17 februari 2003 Auteur Delen Geplaatst: 17 februari 2003 niet in ns7 Quote Link naar reactie
anoniem Geplaatst: 17 februari 2003 Auteur Delen Geplaatst: 17 februari 2003 Deze twee zouden in alle browsers moeten werken. <style> #test{ margin : 200px; background-color : yellow; width : auto; } #test2{ position : absolute; left : 50%; width : 400px; margin-left: -200px; background-color : green; } </style> <div id="test"> test </div> <div id="test2"> test 2 </div> Quote Link naar reactie
anoniem Geplaatst: 17 februari 2003 Auteur Delen Geplaatst: 17 februari 2003 dit werkt idd, maar ie zet ze uit elkaar en ns zet ze tegen elkaar. kan je op dezelfde manier een div in het midden van je scherm krijgen? vind het overigens wel raar dat hier geen standaard oplossingen voor zijn. weet iemand of css3 het volgende gaat ondersteunen:[code:1:d9bcd7520e]left:50%-200px;[/code:1:d9bcd7520e]grtz.. Quote Link naar reactie
anoniem Geplaatst: 17 februari 2003 Auteur Delen Geplaatst: 17 februari 2003 [code:1:2adfc98d75]div { margin-left: auto; margin-right: auto; width: 750px; border: 1px solid; } body { text-align: center; } body > div { text-align: none; }[/code:1:2adfc98d75] Dit werkt in ie5+, opera 6 & 7, mozilla, en ns6+. /E Quote Link naar reactie
anoniem Geplaatst: 17 februari 2003 Auteur Delen Geplaatst: 17 februari 2003 [quote:9f1b215d7e]vind het overigens wel raar dat hier geen standaard oplossingen voor zijn[/quote:9f1b215d7e] De margin op auto zetten is de standaard oplossing alleen IE ondersteunt 't niet. /E Quote Link naar reactie
anoniem Geplaatst: 17 februari 2003 Auteur Delen Geplaatst: 17 februari 2003 Zal wel door de verschillende interpretatie van margin komen. Denk dat het zo wel goed gaat (1e): margin : 0px 200px 0px 200px; Ik zou er ook maar een tegelijkertijd gebruiken. De een is variabel van breedte, de ander vast. Quote Link naar reactie
anoniem Geplaatst: 17 februari 2003 Auteur Delen Geplaatst: 17 februari 2003 [quote:7c129b0255="Eelco Osseweijer"][code:1:7c129b0255]body > div { text-align: none; }[/code:1:7c129b0255][/quote:7c129b0255]een [url=http://tantek.com/CSS/Examples/boxmodelhack.html]link[/url] van bas. hier had ik gelezen dat je geen spaties moest zetten tussen body en > en > en div. [quote:7c129b0255]And be sure to not leave any space around the '>'.[/quote:7c129b0255]dus dat moet misschien ff verandert worden. grtzz.. Quote Link naar reactie
anoniem Geplaatst: 18 februari 2003 Auteur Delen Geplaatst: 18 februari 2003 De oplossing van Eelco lijkt de juiste, bedankt! :D - Bas Quote Link naar reactie
anoniem Geplaatst: 18 februari 2003 Auteur Delen Geplaatst: 18 februari 2003 maar het is alleen met die van gerben mogelijk om de div verticaal in het midden te krijgen toch? grtzz.. Quote Link naar reactie
anoniem Geplaatst: 18 februari 2003 Auteur Delen Geplaatst: 18 februari 2003 Volgens mij wel, maar dat wilde ik op dit moment alleen niet. Maar op zich is het een zeer mooie oplossing. - Bas Quote Link naar reactie
anoniem Geplaatst: 21 februari 2003 Auteur Delen Geplaatst: 21 februari 2003 het sluit wel aan op dit topic dus ik post het probleem hier: [code:1:1a3b043e34] <table width='100%' border='0' cellspacing='0' cellpadding='0' height='100%' align='center'> <tr><td align='center' valign='middle' border='0' width='100%' height='100%'>content is gecentreerd</td></tr> </table> [/code:1:1a3b043e34] en nu wil ik hetzelfde in xhtml strict1.1 [url=http://members.lycos.nl/djamn/juliussteiner/index.html]dit[/url] heb ik gemaakt. ziet er goed uit ware het niet dat opera 6 het compleet verkeerd weergeeft. Heeft er iemand een oplossing? Quote Link naar reactie
Aanbevolen berichten
Om een reactie te plaatsen, moet je eerst inloggen