Trending News
How do you center divs?
I need help centering my divs. I googled it and didn't find the exact help I need. I created my photoshop design and used the slice tool then saved it as div's just I wanna know how can I center all the divs so that the browser shows it in the middle?
<style type="text/css">
<!--
div.Table_01 {
position:absolute;
left:0px;
top:0px;
width:1024px;
height:768px;
}
div.template-1-0-01 {
position:absolute;
left:0px;
top:0px;
width:438px;
height:92px;
}
div.template-1-0-02 {
position:absolute;
left:438px;
top:0px;
width:586px;
height:140px;
}
div.template-1-0-03 {
position:absolute;
left:0px;
top:92px;
width:23px;
height:48px;
}
div.template-1-0-04 {
position:absolute;
left:23px;
top:92px;
width:68px;
height:48px;
}
div.template-1-0-05 {
position:absolute;
left:91px;
top:92px;
width:145px;
height:48px;
}
div.template-1-0-06 {
position:absolute;
left:236px;
top:92px;
width:118px;
height:48px;
}
div.template-1-0-07 {
position:absolute;
left:354px;
top:92px;
width:72px;
height:48px;
}
div.template-1-0-08 {
position:absolute;
left:426px;
top:92px;
width:12px;
height:48px;
}
div.template-1-0-09 {
position:absolute;
left:0px;
top:140px;
width:1024px;
height:37px;
}
div.template-1-0-10 {
position:absolute;
left:0px;
top:177px;
width:1024px;
height:1px;
}
div.template-1-0-11 {
position:absolute;
left:0px;
top:178px;
width:12px;
height:590px;
}
div.template-1-0-12 {
position:absolute;
left:12px;
top:178px;
width:1px;
height:303px;
}
div.template-1-0-13 {
position:absolute;
left:13px;
top:178px;
width:413px;
height:248px;
}
div.template-1-0-14 {
position:absolute;
left:426px;
top:178px;
width:12px;
height:552px;
}
div.template-1-0-15 {
position:absolute;
left:438px;
top:178px;
width:574px;
height:552px;
}
div.template-1-0-16 {
position:absolute;
left:1012px;
top:178px;
width:12px;
height:590px;
}
div.template-1-0-17 {
position:absolute;
left:13px;
top:426px;
width:413px;
height:55px;
}
div.template-1-0-18 {
position:absolute;
left:12px;
top:481px;
width:414px;
height:249px;
}
div.template-1-0-19 {
position:absolute;
left:12px;
top:730px;
width:1000px;
height:38px;
}
-->
</style>
2 Answers
- ?Lv 41 decade agoFavorite Answer
Hi,
Wrap the whole lot in a container or simplay another 'master' <div>
thus;
div.master {
position:absolute;
left:50%;
top:50%;
}
Then in your HTML;
<div class="master">
<div class="template-1-0-19 ">
code for that template here
</div>
</div>
Hope this helps.
Regards.
Source(s): Software Engineer. - 1 decade ago
A way to center a DIV is to set:
margin: 0 auto;
However, this will not work in Internet Explorer. For a cross-browser fix check this short, yet detailed tutorial regarding CSS Horizontal Align:
http://www.w3schools.com/css/css_align.asp
Gabriel, Web Developer, http://www.bitrepository.com/
Source(s): Credits: http://www.w3schools.com/
