What is the best way to align the body of the page in to the center?
<div id='header'>Top fixec
<div id='body' align="center">Main
</div>
</div>
#header
{
position: fixed;
top: 0px;
height: 20px;
width: 100%;
background: green;
}
#body
{
margin-top: 30px;
height: 3000px;
overflow: auto;
}
The above works but the align="center" is deprecated so what is the equivalent to it?
Or a good way to use css to have top page fixed and body contents centered? Also, it should not affect when i use media queries for a responsive site.
<div id='body' align="center">Main
</div>
</div>
#header
{
position: fixed;
top: 0px;
height: 20px;
width: 100%;
background: green;
}
#body
{
margin-top: 30px;
height: 3000px;
overflow: auto;
}
The above works but the align="center" is deprecated so what is the equivalent to it?
Or a good way to use css to have top page fixed and body contents centered? Also, it should not affect when i use media queries for a responsive site.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
#header
{
padding: 10px;
position: fixed;
top: 0px;
height: 22px;
width: 100%;
background: green;
color: White;
font-size: large;
}
#headersizeTomovethebodydo
{
width: 100%;
margin-top: 40px;
}
#body
{
margin: auto;
height: 3000px;
overflow: auto;
color: Black;
width: 960px;
}
I have the above so far.
Do anyone has a sample css which get me started. Obviously, I wanted it to be responsive also.
{
padding: 10px;
position: fixed;
top: 0px;
height: 22px;
width: 100%;
background: green;
color: White;
font-size: large;
}
#headersizeTomovethebodydo
{
width: 100%;
margin-top: 40px;
}
#body
{
margin: auto;
height: 3000px;
overflow: auto;
color: Black;
width: 960px;
}
I have the above so far.
Do anyone has a sample css which get me started. Obviously, I wanted it to be responsive also.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Why the scrolls do not appear?
body {
margin: 0;
padding: 0;
}
#header
{
padding: 10px;
position: fixed;
top: 0px;
height: 20px;
width: 100%;
background: green;
color: White;
font-size: large;
}
#content
{
margin: 20px auto 0 auto;
overflow: auto;
color: Black;
width: 60%;
}
body {
margin: 0;
padding: 0;
}
#header
{
padding: 10px;
position: fixed;
top: 0px;
height: 20px;
width: 100%;
background: green;
color: White;
font-size: large;
}
#content
{
margin: 20px auto 0 auto;
overflow: auto;
color: Black;
width: 60%;
}
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
yes
So all ok now?
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
The vertical or horizontal scroll do not appear to view the additional contents.
ASKER
I think I have been getting some silly suggestions by the experts!!!
As soon as we put,
position: fixed;
The vertical page scroll disappears.
As soon as we put,
position: fixed;
The vertical page scroll disappears.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
I am very thankful to all the experts! All their suggestions are correct.
Not sure how I can go back and award them points
Not sure how I can go back and award them points
Just request attention and a moderator can help :) however the selected comment you've chosen does answer your question. Everything after is kinda superfluous don't you think? I appreciate your comments though.
ASKER
Thank you to all the experts
ASKER