Button transition

div {
    font: 22px Arial;
    display: inline-block;
    padding: 1em 2em;
    text-align: center;
    color: white;
    background: red; /* default color */

    /* "to left" / "to right" - affects initial color */
    background: linear-gradient(to left, salmon 50%, lightblue 50%) right;
    background-size: 200%;
    transition: .5s ease-out;
}
div:hover {
    background-position: left;
}

Source: stackoverflow.com

Similar codes

2 votes291 views2 answers
Css fill parent height
CSS
0 vote275 views1 answer
Css selector all class prefix
CSS
19 votes287 views3 answers
Css stop scrollbar
CSS
9 votes287 views4 answers
Chmod recursive
CSS
0 vote291 views1 answer
Powershell convertto-html css
CSS
1 vote281 views2 answers
Only ie css
CSS
0 vote279 views1 answer
Redesign html select
CSS
0 vote276 views1 answer
Css div background image loading
CSS
161 votes390 views4 answers
Link external css
CSS
0 vote292 views1 answer
Responsive arrow breadcrumbs css site:stackoverflow.com
CSS