JSFiddle - React, Tailwind, and code Playground

by Stéphane Cabaret

HTML

<div class="header">
    <h1>Title</h1>
    <div class="nav">
        <a>A Link</a>
        <a>Another Link</a>
        <a>A Third Link</a>
    </div>
</div>

CSS

.header {
    background: #ccc; 
    font-size: 1px;
    text-align: justify; 

     /* IE special */  
    width: 100%;  
    -ms-text-justify: distribute-all-lines;
    text-justify: distribute-all-lines;
}
 .header:after{
    content: '';
    display: inline-block;
    width: 100%;
    height: 0;
    font-size:0;
    line-height:0;
}

h1 {
    display: inline-block;
    margin-top: 0.321em; 
    font-size: 14px;

    /* ie 7*/ 
    *display: inline;
    *zoom: 1;
    *text-align: left; 
}

.nav {
    display: inline-block;
    vertical-align: baseline; 
    font-size: 14px;
    
    
    /* ie 7*/
    *display: inline;
    *zoom:1;
    *text-align: right;
}