martins Posted June 19, 2010 Share Posted June 19, 2010 Hi all, I am learning css positioning (relative, absolute, etc). I know that if a div is not in any container than it will treat the whole screen as its ancestor/container. How would I create a parent div to all. The whole page would actually be inside this div (which, say, should have the width of 1024px and should be centered on the screen regardless of the size of the monitor. I hope it makes sense. Thank you for your time. martin Quote Link to comment Share on other sites More sharing options...
TOA Posted June 19, 2010 Share Posted June 19, 2010 If I understand you, this might help The html would be <body> <div id="container"> Content here. <!-- end #container --></div> </body> And the css would be body { margin: 0; padding: 0; text-align: center; } #container { width: 1024px; margin: 0 auto; text-align: left; } If this isn't what you're looking for, let me know. Quote Link to comment Share on other sites More sharing options...
martins Posted June 19, 2010 Author Share Posted June 19, 2010 Thank you. I've just tried it and it seems that it was what I wanted. One question though: in body css there is text-align: center I thought it would only apply to 'text' not a container like div? How is it so? thanks again Quote Link to comment Share on other sites More sharing options...
martins Posted June 19, 2010 Author Share Posted June 19, 2010 Actually, one more question: Would this solution for positioning a website in the centre be recommended? Are there better ways of doing it? edit: I'm not talking about your particular solution, but generally about my idea. Quote Link to comment Share on other sites More sharing options...
haku Posted June 19, 2010 Share Posted June 19, 2010 Thank you. I've just tried it and it seems that it was what I wanted. One question though: in body css there is text-align: center I thought it would only apply to 'text' not a container like div? How is it so? thanks again text-align will work on any element. However, this text-align:center then aligning sub elements to the left is unnecessary. It was a hack for old browsers that people don't use anymore. This is all you need on your container: margin:0 auto; That will center it. Quote Link to comment Share on other sites More sharing options...
martins Posted June 19, 2010 Author Share Posted June 19, 2010 ok thanks for your replies. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.