JSFiddle - React, Tailwind, and code Playground

by Nightythehawk

HTML

<div class="streambadge-redirector">
    <a href="https://twitch.tv/" class="streambadge-redirector__link">
        <span class="visuallyhidden">Twitch.tv</span>
    </a>
    <iframe src="http://streambadge.com/twitch/aad_nighty_/" style="border:none;height:4em;width:100%" class="streambadge-redirector__iframe" tabindex="-1" aria-hidden="true"></iframe>
</div>

CSS

.streambadge-redirector {
    position: relative;
}

.streambadge-redirector__link,
.streambadge-redirector__iframe {
    left: 0;
    height: 4em;
    position: absolute;
    top: 0;
    width: 100%;
}

.streambadge-redirector__link {
    background-color: transparent;
    display: block;
    z-index: 3;
}

.streambadge-redirector__iframe {
    border: 0;
    z-index: 2;
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    white-space: nowrap;
}