JSFiddle - React, Tailwind, and code Playground

HTML

<div id="outer-menu-bar" style="width:600px;height:32px; border: 1px solid red;">  
    <div class="inner-menu" style="width:250px;height:32px; border: 1px solid green;">Foo foo</div>
    <div class="inner-menu" style="width:140px;height:32px; border: 1px solid blue;">Foo foo</div>
</div>

CSS

#outer-menu-bar {
    text-align: center;
}

.inner-menu {
    display: inline-block;
    background-color: lightgrey;
}