JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrap_header">
<ul>
    <li><a href="#">MENU ITEM 1</a></li>
    <li><a href="#">MENU ITEM 2</a></li>
    <li id="header logo"><img src="http://www.prskelet.com/images/logotip.jpg"/></li> 
    <li><a href="#">MENU ITEM 3</a></li>
    <li><a href="#">MENU ITEM 4</a></li>
</ul>
</div><!--END wrap_header-->

CSS

ul li{
    margin-right:20px;
    line-height:200px;
    float:left;
    vertical-align:middle;
}
ul li img{
    height:200px;
    width:auto;
}
ul li a {
     text-decoration:none;
      border-bottom:2px solid red;
}