test

div.static {
position: static;
border: 3px solid #73AD21;
}

position: static;

An element with position: static; is not positioned in any special way; it is
always positioned according to the normal flow of the page:

This div element has position: static;

div {
width: 100px;
height: 100px;
background-color: red;
position: relative;
-webkit-animation-name: example; /* Chrome, Safari, Opera */
-webkit-animation-duration: 4s; /* Chrome, Safari, Opera */
-webkit-animation-delay: 2s; /* Chrome, Safari, Opera */
animation-name: example;
animation-duration: 4s;
animation-delay: 2s;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes example {
0% {background-color:red; left:0px; top:0px;}
25% {background-color:yellow; left:200px; top:0px;}
50% {background-color:blue; left:200px; top:200px;}
75% {background-color:green; left:0px; top:200px;}
100% {background-color:red; left:0px; top:0px;}
}

/* Standard syntax */
@keyframes example {
0% {background-color:red; left:0px; top:0px;}
25% {background-color:yellow; left:200px; top:0px;}
50% {background-color:blue; left:200px; top:200px;}
75% {background-color:green; left:0px; top:200px;}
100% {background-color:red; left:0px; top:0px;}
}

Note: This example does not work in Internet Explorer 9 and earlier versions.

Advertisements