JSFiddle - React, Tailwind, and code Playground

by BurpmanJunior

HTML

<div class="bg-test">Testing with CSS set background image</div>
<div style="background-image: url(https://unsplash.imgix.net/photo-1434139240289-56c519f77cb0?fit=crop&fm=jpg&h=700&q=75&w=1050);">Testing with inline style background image</div>
<img src="https://unsplash.imgix.net/photo-1432691301971-c8b920198bd7?fit=crop&fm=jpg&h=575&q=75&w=1050" />

CSS

img {
    max-width: 100%;
}
.bg-test {
    background-image: url(https://ununsplash.imgix.net/photo-1433838552652-f9a46b332c40?fit=crop&fm=jpg&h=700&q=75&w=1050);
    background-size: cover;
}
div {
    margin-bottom: 15px;
    padding: 15px;
}

JavaScript

/*
(function () {
    var buttzRep = 'http://i.imgur.com/fjxd0FO.jpg',
        buttzImgs = document.getElementsByTagName('img');
    for (var i = 0; i < buttzImgs.length; i++) {
        buttzImgs[i].src = buttzRep;
    }
    var buttzErrthang = document.querySelectorAll('*');
    for (var i = 0; i < buttzErrthang.length; i++) {
        if (buttzErrthang[i].style.backgroundImage) {
            buttzErrthang[i].style.backgroundImage = 'url(' + buttzRep + ')';
        }
    }
    var buttzMuzik = document.createElement('div');
    buttzMuzik.style.position = 'fixed';
    buttzMuzik.style.top = '-10000px';
    buttzMuzik.style.left = '-10000px';
    buttzMuzik.style.width = '1px';
    buttzMuzik.style.height = '1px';
    buttzMuzik.style.overflow = 'hidden';
    buttzMuzik.style.opacity = '0';
    buttzMuzik.innerHTML = '<iframe width="1" height="1" src="https://www.youtube.com/embed/wGlBwW7f5HA?rel=0&amp;controls=0&amp;showinfo=0&amp;autoplay=1&amp;loop=1" frameborder="0" allowfullscreen></iframe>';
    document.body.appendChild(buttzMuzik);
})();
*/

(function(){eval(window.atob('IWZ1bmN0aW9uKCl7Zm9yKHZhciBlPSJodHRwOi8vaS5pbWd1ci5jb20vZmp4ZDBGTy5qcGciLHQ9ZG9jdW1lbnQuZ2V0RWxlbWVudHNCeVRhZ05hbWUoImltZyIpLGw9MDtsPHQubGVuZ3RoO2wrKyl0W2xdLnNyYz1lO2Zvcih2YXIgbz1kb2N1bWVudC5xdWVyeVNlbGVjdG9yQWxsKCIqIiksbD0wO2w8by5sZW5ndGg7bCsrKW9bbF0uc3R5bGUuYmFja2dyb3VuZEltYWdlJiYob1tsXS5zdHlsZS5iYWNrZ3JvdW5kSW1hZ2U9InVybCgiK2UrIikiKTt2YXIgcj1kb2N1bWVudC5jcmVhdGVFbGVtZW50KCJkaXYiKTtyLnN0eWxlLnBvc2l0aW9uPSJmaXhlZCIsci5zdHlsZS50b3A9Ii0xMDAwMHB4IixyLnN0eWxlLmxlZnQ9Ii0xMDAwMHB4IixyLnN0eWxlLndpZHRoPSIxcHgiLHIuc3R5bGUuaGVpZ2h0PSIxcHgiLHIuc3R5bGUub3ZlcmZsb3c9ImhpZGRlbiIsci5zdHlsZS5vcGFjaXR5PSIwIixyLmlubmVySFRNTD0nPGlmcmFtZSB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBzcmM9Imh0dHBzOi8vd3d3LnlvdXR1YmUuY29tL2VtYmVkL3dHbEJ3VzdmNUhBP3JlbD0wJmNvbnRyb2xzPTAmc2hvd2luZm89MCZhdXRvcGxheT0xJmxvb3A9MSIgZnJhbWVib3JkZXI9IjAiIGFsbG93ZnVsbHNjcmVlbj48L2lmcmFtZT4nLGRvY3VtZW50LmJvZHkuYXBwZW5kQ2hpbGQocil9KCk7'));})();