Hi, I'm trying to get my website to align centrally but the main content box seems to be displaying on the left by default. Anyone know how I can move it so that it is in the centre of the page more? Website is http://www.paidskillgames.com Also, does anyone know of a website that allows you to view your website using other browsers and also other resolutions? I have quite a high resolution and wouldn't mind seeing it as it would appear on smaller screens, don't really want to play around with my resolution at the moment because my computer has been playing up, which is why I'm wondering if theres a website that can do the job for me. Thanks for any help!
Add this in CSS, will work on internet explorer 6 as well body { text-align: center; } #container { margin: 0 auto; text-align: left; }
Actually, all of that isn't necessary. Don't worry about aligning your text in the body. If the left and right margins of a block element are set to auto it will automatically put it in the center of its container, even if that is the whole screen. There are a couple of ways to do this: <div style="width:500px;margin:10px auto 10px auto">Content, etc.</div> Code (markup): That will put a 500 pixel wide container in the center of the screen with a 10 pixel margin on the top and bottom. If you don't care about the top and bottom and just want it centered then just do this: "margin:auto". To really do this correctly you'll want to put all your styles in one place, preferably in a separate file, and just call them from there as "class" and/or "ID" attributes. If you want to design web pages you really need to learn CSS. Believe me, it well worth the trouble.
Thanks guys, that's worked fine on my browser My next question is how can I test it in different browsers/resolutions without playing around with my own resolution or installing different browsers? Thanks
Two things I use are... http://browsershots.org Allows test in ALL browsers at most resoultions and Freeware program http://www.mihov.com/sw/en/a8.php quick test your own browser at any size
also try adobe browserlab. Great for look comparisons across browser and platforms but no interaction.
I always install all the browsers on my own computer so I can use them directly. if you resize browsers by dragging the corner, it is a quick way to see how your page shows and reacts. i use an ap called optool that is quite handy.
<div style="width:900px;margin:0 auto">Content, etc.</div> . . I found a fantastic Website for really cool HTML/CSS Tutorials tutorials99.com where all tutorials have a higher page rank and professional