RobinTibbs Posted January 19, 2007 Share Posted January 19, 2007 ok, i have concocted a nice enough layout, but i want to know the best way of getting it so its centred in the browser window rather than taking up the whole viewport. many thanks. hope that makes sense :) Link to comment https://forums.phpfreaks.com/topic/34882-centre-layout/ Share on other sites More sharing options...
obsidian Posted January 19, 2007 Share Posted January 19, 2007 Easy 3 step process:1. Decide on how wide you want your layout to be.2. Place a text-align: center; on your body3. Set a wrapper div (I usually actually call it id="wrapper") around your entire content with your centering CSS:[code]#wrapper { text-align: left; /* To offset the center of the body */ margin: 0 auto; /* This is the key (right and left auto margins) */ width: 760px; /* Or however wide you decided in step one */ }[/code]That's really all there is to it. Hope this helps! Link to comment https://forums.phpfreaks.com/topic/34882-centre-layout/#findComment-164429 Share on other sites More sharing options...
jcombs_31 Posted January 19, 2007 Share Posted January 19, 2007 The text alignments are not needed. Just set the auto margin and the width. Link to comment https://forums.phpfreaks.com/topic/34882-centre-layout/#findComment-164465 Share on other sites More sharing options...
obsidian Posted January 19, 2007 Share Posted January 19, 2007 [quote author=jcombs_31 link=topic=123140.msg508609#msg508609 date=1169219908]The text alignments are not needed. Just set the auto margin and the width. [/quote]The text alignments [b]are[/b] needed for some non-mainstream browsers.It acts as a safety net more than anything else... although jcombs_31 is right that for IE 5+ and FF, it is not needed. Link to comment https://forums.phpfreaks.com/topic/34882-centre-layout/#findComment-164483 Share on other sites More sharing options...
jcombs_31 Posted January 19, 2007 Share Posted January 19, 2007 what browsers DO need it? I know IE, Opera, Firefox, Safari, Netscape, and Konqueror all seem to handle it fine. Link to comment https://forums.phpfreaks.com/topic/34882-centre-layout/#findComment-164496 Share on other sites More sharing options...
obsidian Posted January 19, 2007 Share Posted January 19, 2007 I've had problems with IE5, Netscape, AOL, Konqueror and IE5 Mac at different times, and that safety net has fixed it for me in every case. Grant it, it may have been caused by other display elements in the CSS, but having that as a safety net fixes it nonetheless, so I'm adamant about recommending people to use that as a precaution in their displays. Link to comment https://forums.phpfreaks.com/topic/34882-centre-layout/#findComment-164499 Share on other sites More sharing options...
RobinTibbs Posted January 19, 2007 Author Share Posted January 19, 2007 thats worked great thanks, the "margin: 0 auto;" in the 'wrapper' css is the 0 for the top/bottom margins then? Link to comment https://forums.phpfreaks.com/topic/34882-centre-layout/#findComment-164622 Share on other sites More sharing options...
jcombs_31 Posted January 19, 2007 Share Posted January 19, 2007 yes, you can change it if you want to increase the top/bottom margins. Link to comment https://forums.phpfreaks.com/topic/34882-centre-layout/#findComment-164627 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.