JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="topnav">
            <li class="kitchy"><a href="#"><img src="http://daveywhitney.com/dark/img/kitch.jpg" /></a></li>
            <li><img src="http://daveywhitney.com/dark/img/deck_small.jpg" /></li>
            <li><img src="http://daveywhitney.com/dark/img/door_small.jpg" /></li>
            <li><img src="http://daveywhitney.com/dark/img/lumber_small.jpg" /></li>
            <li><img src="http://daveywhitney.com/dark/img/tools_small.jpg" /></li>
            <li><img src="http://daveywhitney.com/dark/img/paint_small.jpg" /></li>
        </ul>

CSS

#topnav {
    float:left;
    margin:22px 0 0 50px;
    list-style:none;
}
.kitchy {
    background-color:#000000;
}

#topnav  a:hover{
    opacity:.6;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
    filter: alpha(opacity=60); 
    /* see http://www.quirksmode.org/css/opacity.html */
}

#topnav  li {
    float: left;
}