JSFiddle - React, Tailwind, and code Playground

by orig

HTML

<div class="container">
    <a class="whatever" href="javascript:void(0);">
        <img class="float" src="http://www.w3.org/2008/site/images/logo-w3c-mobile-lg"/>
        <img class="float" src="http://www.w3.org/2008/site/images/logo-w3c-mobile-lg"/>
        <img class="float" src="http://www.w3.org/2008/site/images/logo-w3c-mobile-lg"/>
    </a>
</div>
<div class="clear"></div>
<div class="container">
    <button class="whatever">
        <img class="float" src="http://www.w3.org/2008/site/images/logo-w3c-mobile-lg"/>
        <img class="float" src="http://www.w3.org/2008/site/images/logo-w3c-mobile-lg"/>
        <img class="float" src="http://www.w3.org/2008/site/images/logo-w3c-mobile-lg"/>
        <span class="clear"></span>
    </button>
</div>

CSS

.container {
    overflow: hidden; width: 100%;
}    
.whatever {
    display: inline;
    margin: 0;
    padding: 0;
    background: none;
    border: none;
    height: 50px;
    overflow: auto;
    width: 100%
}

.clear { clear: both; font-size: 0px; line-height: 0px; height: 0px; overflow:hidden; }

div.clear {
    height: 5px;
}
.float {
    float: left;
}