Center absolutely positioned DIV using CSS
I’ve seen people write javascript in order to centre an absolutely positioned div. All that is needed is the following
snippet of CSS.
-
.notice
-
{
-
position: absolute;
-
width: 400px;
-
top: 0px;
-
left: 50%;
-
margin-left: -200px;
-
}
Basically, left: 50% means the div is centered, but from the top left corner of the div, to fix this margin-left should be half the width and negative.
The same technique can be applied to show absolutely positioned div footer that is always visible, just set top: 100% and margin-top to be the same as the height of the element.
No comments