css3 fade in on page load, out after seconds

Question

i have been searching around stackoverflow for an answer for a while but it seems to me this isn\'t been questioned before.

excuses if i might have missed the answer som

Answer 1

You should use only one animation for an element: http://jsfiddle.net/maximgladkov/YR5UM/

@-webkit-keyframes fade {
    0% {
        opacity: 0;
    }

    10% {
        opacity: 1;
    }

    90% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

div {
    width: 400px;
    margin: 0 auto;
    text-align: center;
    -webkit-animation: fade 6s;
    -webkit-animation-fill-mode: both;
}