Not signed in (Sign In)
SkillShare - A place to discuss Web Standards and Web Design topics
Categories
Vanilla 1.1.5a is a product of Lussumo. More Information: Documentation, Community Support.
-
http://jeromeobille.com/temp_uploads/jerzgarden/
I made this site and i can't figure out how to center my page without affecting
my contents? I want my page to be always in center everytime user resize their browser.
right now the way i centered it is just: margin-left:x%;
Any code recommendations displaying the same output. -
To center your page using CSS, define a <div id="main"> (you can call it whatever you want) inside your <body> statement with the following CSS.
#main {
margin-left: auto;
margin-right: auto;
width: 800px; /*(or whatever size, height doesn't matter)*/
} -
I will try that. tnx
-
- CommentAuthorNick Presta
- CommentTimeFeb 23rd 2006
width must be defined.
margin: 0 auto;
You don't need a container div, just apply that CSS to the body. -
I tried both of your code and it works(tnx). [but i still have an annoying problem]The reason why i'm having a problem centering my page is because i'm using an absolute positioning to my footer graphic.
This css works in IE:
body {
font-family:Georgia, "Times New Roman", Times, serif;
font-size:12px;
color:#649600;
width:846px;
text-align:center;
/*text-align:center;*/
}
#main {
/*margin-left: auto;
margin-right: auto;*/
width: 846px; /*(or whatever size)*/
}
-----------------------------------------------------------------
This css works in Mozilla:
body {
font-family:Georgia, "Times New Roman", Times, serif;
font-size:12px;
color:#649600;
width:846px;
margin:0 auto;
}
#main {
margin-left: auto;
margin-right: auto;
width: 846px; /*(or whatever size)*/
}
Once again here is the link of my project site.
just incase you need the code.
http://jeromeobille.com/temp_uploads/jerzgarden/ -
I suggest going with nick's method. It's cleaner and it keeps the div numbers to a minimum.
I'm typing form school now and I can't look into your source just yet. But my opinion is that you should scrap your absolute positioning for your footer. If you want that effect for the leaves (?) to cover the bottom of your content area you can apply a negative margin to it's containing div and get the same effect but more flexible than absolute pos. -
Thank you all, thru all those suggestions i got it working by tweeking around the code. here is what i got:
Its good enaugh to get what i want.
body {
font-family:Georgia, "Times New Roman", Times, serif;
font-size:12px;
color:#649600;
width:846px;
margin:0 auto;
text-align: center;
}
#main {
margin: 0 auto;
width: 846px; /*(or whatever size)*/
text-align: center;
}
Imma get my teqhila and take a shot.:) -
That's a good suggestion nick1presta. I tried your way and it works great with less code. Thanks. =)
1 to 8 of 8