JSFiddle - React, Tailwind, and code Playground
by derekhill
HTML
<div class='source youtube'></div>
<svg>
<foreignObject height=50 width=50>
<div class='source facebook'></div>
</foreignObject>
<svg>
CSS
.source {
width: 30px;
height: 19px;
display: inline-block;
margin-bottom: -3px; }
.youtube {
background-image: url(https://s3.amazonaws.com/856/sprite.png);
background-position: 0 -69px;
background-repeat: no-repeat; }
.facebook {
background-image: url(https://s3.amazonaws.com/856/sprite.png);
background-position: -31px -70px;
background-repeat: no-repeat; }