Weird CSS3 Transition (flackernd)
Wenn ich mit der Maus auf meine Schaltfläche gehe, blinkt sie beim Starten des Übergangs zuerst weiß. Warum flackert es, wenn ich einen CSS3-Übergang auf meine Schaltfläche wende?Mein Browser ist Google Chrome
Siehe hier<code><button>Log In</button> </code>
CSS:
<code>button { background: #ff3019; background: -moz-linear-gradient(top, #ff3019 0%, #cf0404 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff3019), color-stop(100%,#cf0404)); background: -webkit-linear-gradient(top, #ff3019 0%,#cf0404 100%); background: -o-linear-gradient(top, #ff3019 0%,#cf0404 100%); background: -ms-linear-gradient(top, #ff3019 0%,#cf0404 100%); background: linear-gradient(top, #ff3019 0%,#cf0404 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3019', endColorstr='#cf0404',GradientType=0 ); border:1px solid #890000; display:block; margin:0 auto; width:200px; padding:5px 0; border-radius:8px; color:#fff; font-weight:700; text-shadow:0 1px 1px #000+50; box-shadow:0 2px 3px #000+150; -webkit-transition:background linear .5s; } button:hover { background:#ff3019; } button:active { background:#cf0404; } </code>