How to center my entire web application using div tag?
My JSF web application is left aligned and it looks odd. I wanted to make its appearance centered in all browsers.
I tried this and it didn't work:
#main {
margin:0 auto;
text-align:center;
}
I also tried:
div align="center"...
inside html body, but no use开发者_StackOverflow社区.
How can I center #main?
try
#main{
margin: 0px auto;
}
Also remember to set a width else it will be 100% causing it to be the whole page making it look left aligned.
#main {
margin: 0 auto;
width: 960px; /* or whatever you like */
}
#main needs a fixed width for this to work: http://jsfiddle.net/RVpUQ/1/
#main {
margin:0 auto;
width: 55px;
}
You need a width and to set the margin to auto
You need to add a width as well.
#main {
margin:0 auto;
width: 75%;
text-align:center;
}
<html>
<body>
<div class="divContainer">
<div class="divCentral">
<h1>My content herer</h1>
</div>
</div>
</body>
</html>
and CSS is
.divContainer
{
background-color:gray;
width:100%;
min-height:500px;
}
.divCentral
{
width:90%;
background-color:white;
min-height:480px;
margin:0 auto;
}
Here is the sample http://jsfiddle.net/eptGU/4/
You can use css setting it like this :
this goes on the div style:
border: 1px solid white; height: 90%; margin-left: auto; margin-right: auto; top: 0px; position: relative; width: 879px;
so you define a width for the div and then browser autocenters it.
and you must set the following attribute into the body style:
text-align:center;
this goes on the style of the body tag of the page this makes iexplorer implements the correct behavior.
加载中,请稍侯......
精彩评论