Link to home
Start Free TrialLog in
Avatar of mrab
mrabFlag for United Kingdom of Great Britain and Northern Ireland

asked on

how do i center layers so that they are always in the middle of any screen?

I have centered layers on a website - but on a widescreen computer the layers move to the left.
What coding do i place to ensure that all layers a re centered on any screen?
Avatar of Lukasz Chmielewski
Lukasz Chmielewski
Flag of Poland image

the div:

<div id="main">
test
</div>

css example
#main
{
      position: absolute;
      top:50%;
      left: 50%;
      margin-top: -250px; /* make this half your image/element height */
      margin-left: -450px; /* make this half your image/element width */
      height: 500px;
      width: 900px;
      display: table;
      vertical-align: middle;
      border: 1px solid #7D5700;
}
Avatar of mrab

ASKER

What if I want to get layer middle of the sreen but just horizontal?
eg if it were a Banner?
ASKER CERTIFIED SOLUTION
Avatar of Lukasz Chmielewski
Lukasz Chmielewski
Flag of Poland image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial