Possible solution: transparent to :visible pseudoclass.

dabblet.css

/* 
Possible solution: transparent to :visible pseudoclass.
BTW, it's not Webkit, it's chrome-only bug (at least MAC version 16.0.912.63)
Feel free to comment.
http://kyuumeitai.posterous.com/
*/

a {
	-moz-transition: 1s background;
	-ms-transition: 1s background;
	-o-transition: 1s background;
	-webkit-transition: 1s background;
	display: block;
	height: 100px;
	background: #f0f;
} 
a:hover{
	background: #0f0;		
	}

a:visited{
	/*BINGO: removing :visited pseudoclass out of the equation with "transparent"*/
	background: transparent;
	}



/* Trying with other orders and transition ease declarations
No luck.
note: If there's any color involved t doesn't work. The morning example worked because the initial declaration
of rgba color was full transparent.
*/
/*
a{
	-moz-transition:  all 1s ease;
	-ms-transition:  all 1s ease;
	-o-transition:  all 1s ease;
	-webkit-transition: all 1s ease;
	display: block;
	height: 100px;
	background: rgba(0,0,0,.4);
	color: #cafe00;
} 
a:hover{
	background: #0ff !important;
	}
*/


/* Other animations instances
- Chrome: works height transition, just color properties are affected (border-color, background, color, etc).
- Firefox: just fine.
*/
/*
a {
	-moz-transition: 1s all;
	-ms-transition: 1s all;
	-o-transition: 1s all;
	-webkit-transition: 1s all;

	display: block;
	height: 100px;
	background: #f0f;
	color: #cafe00;
} 
a:hover{
	background: #0f0;
	-moz-transition: 1s all;
	-ms-transition: 1s all;
	-o-transition: 1s all;
	-webkit-transition: 1s all;	
	height: 200px;
	display: block;
	color: #000;
	}
*/
/* From hex to hex, DIFFERENT COLOR: fail 
Method: trying to replicate the :visited solution but with different declarations. Doesn't work.
*/
/*
a {
	-moz-transition: 1s background;
	-ms-transition: 1s background;
	-o-transition: 1s background;
	-webkit-transition: 1s background;
	display: block;
	height: 100px;
	background: #f0f;
} 
a:hover{
	background: #0f0 !important;	
	-moz-transition: 1s background;
	-ms-transition: 1s background;
	-o-transition: 1s background;
	-webkit-transition: 1s background;	
	}

a:visited{
	background: #f0f;
	-moz-transition: 1s background;
	-ms-transition: 1s background;
	-o-transition: 1s background;
	-webkit-transition: 1s background;	
	}
*/

/* From hex to hex, DIFFERENT COLOR: fail 
Method: declaring :visited with style
- in Chrome, the :visible has more priority over hover (theory confirmed). 
If a:hover has an !important, it changes the color but it doesn't animate.
- in Firefox works, but it doesn't make the hover-visible transition (a little jumpy)
*/
/*
a {
	-moz-transition: 1s background;
	-ms-transition: 1s background;
	-o-transition: 1s background;
	-webkit-transition: 1s background;
	display: block;
	height: 100px;
	background: #f0f;
} 
a:hover{
	background: #0f0;	
	}

a:visited{
	background: #ff0;
	}
*/

/* From hex to hex, DIFFERENT COLOR: fail 
Method: declaring transition in a:hover again
*/
/*
a {
	-moz-transition: 1s background;
	-ms-transition: 1s background;
	-o-transition: 1s background;
	-webkit-transition: 1s background;
	display: block;
	height: 100px;
	background: #f0f;
} 
a:hover{
	background: #0f0;
	-moz-transition: 1s background;
	-ms-transition: 1s background;
	-o-transition: 1s background;
	-webkit-transition: 1s background;	
}
*/

/* From rgba to hex, DIFFERENT COLOR (with transparency): OK 
Method: declaring a:visited with a:hover 
Theory: the :visited pseudoclass prioritizes instead :hover
*/
/*
a {
	-moz-transition: 1s background;
	-ms-transition: 1s background;
	-o-transition: 1s background;
	-webkit-transition: 1s background;
	display: block;
	height: 100px;
	background: rgba(255,0,255, 0);
} 
a:hover,
a:visited{
	background: #0f0;
}
*/


/* From rgba to hex, SAME COLOR (with transparency): OK */
/*
a {
	-moz-transition: 1s background;
	-ms-transition: 1s background;
	-o-transition: 1s background;
	-webkit-transition: 1s background;
	display: block;
	height: 100px;
	background: rgba(255,0,255, 0);
} 
a:hover{
	background: #f0f;
}
*/




/* From rgba to rgba, DIFFERENT COLOR (with transparency): fail 
The color transition fails, the transparency is ok.
*/
/*
a {
	-moz-transition: 1s background;
	-ms-transition: 1s background;
	-o-transition: 1s background;
	-webkit-transition: 1s background;
	display: block;
	height: 100px;
	background: rgba(255,0,255, 0);
} 
a:hover{
	background: rgba(255,0,0, 1);
}
*/

/* From rgba to rgba, SAME COLOR (just transparency): OK */
/*
a {
	-moz-transition: 1s background;
	-ms-transition: 1s background;
	-o-transition: 1s background;
	-webkit-transition: 1s background;
	display: block;
	height: 100px;
	background: rgba(255,0,255, 0);
} 
a:hover{
	background: rgba(255,0,255, 1);
}
*/

/* From rgba to hex color: fail (in Webkit always) */
/*
a {
	-moz-transition: 1s background;
	-ms-transition: 1s background;
	-o-transition: 1s background;
	-webkit-transition: 1s background;
	display: block;
	height: 100px;
	background: rgba(255,0,255, 0);
} 
a:hover{
	background: #0f0;
}
*/

dabblet.html

<a href="http://google.com" target="_blank">A real link</a>

settings.json

{"view":"split","prefixfree":"","page":"css"}