JSFiddle - React, Tailwind, and code Playground

HTML

<div id="header" class="header">
    <div class="logo">
        <img src="/Content/images/my_logo.png" alt="" />
    </div>
    <div class="logoClient">
        Test Client /*here can be text or image with ANY SIZE */
    </div>
    <div class="clear"></div>
</div>

CSS

.header 
{
    width: 950px;
    font-family:Helvetica, Arial, sans-serif;
}

.logo {
    float: left;
    height: 55px;
    padding: 10px 20px;
    background: #004B35;
    width: 700px;
}
       
 .logoClient 
 {
    float: right;
    height: 55px;
    line-height: 55px;
    padding: 10px 0px;
    margin:0px -10px 0px 0px;
    font-size: 30px;
    color: #004B35;
    overflow:hidden;
    font-weight: bold;
    width: 200px;
    text-align: right;
}

.logoClient img 
{
    max-height: 40px;
    max-width:200px;
    margin: 0px;
}

.clear 
{
    clear: both;
}