Untitled

dabblet.css

.thing {
	padding: 1rem;
	border: 1px solid rebeccapurple;
	position: relative;
	width: 10rem;
}

.thing__link2 {
	position: absolute;
	right: 1rem;
	background: #fff;
	padding-left: 1rem;
	opacity: 0;
	transition: opacity .2s;
}

.thing__link2:focus,
.thing__link2:hover,
.thing__link1:hover + .thing__link2 {
	opacity: 1;
}

dabblet.html

<div class="thing">
	<a class="thing__link1" href="#">Link 1 is a bit long</a>
	<a class="thing__link2" href="#">Link 2 is smaller</a>
</div>

dabblet.js

// alert('Hello world!');

settings.json

{"view":"separate","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}