JSFiddle - React, Tailwind, and code Playground

by necolas

HTML

<b>IE7 font-crushing IR bug</b>
<div class="ir">Google testing</div>

<b>IE7 positive text-indent IR bug</b>
<div class="kir">Google testing</div>

CSS

.ir {
    background: url('https://www.google.com/images/srpr/logo3w.png') no-repeat 0 0;
    height: 75px;
    width: 275px;
    font: 0/0 a;
    text-shadow: none;
    color: transparent;
    padding: 0 0 20px;
}

.kir {
    background: url('https://www.google.com/images/srpr/logo3w.png') no-repeat center;
    height: 95px;
    width: 275px;
    text-indent: 100%;    
    overflow: hidden;
    white-space: nowrap;
    padding: 0;
}