JSFiddle - React, Tailwind, and code Playground

HTML

<header class="pagehdr-slice">
    <div class="pagehdr-titlebox"
       ><div class="pagehdr-title-icons">[*]</div
       ><div class="pagehdr-title">My Title</div
    ></div>
</header>

CSS

.pagehdr-slice {
    padding: 0 32px;
    height: 40px;
    line-height: 40px;
    background-color: #2980BA;
    border-bottom: 3px solid #3273a2;
}

.pagehdr-titlebox {
    color: #AAD0E8;
    width: 200px;
    border-right: 1px solid red;
    font-size: 0;
    line-height: 0;
}

.pagehdr-title-icons, .pagehdr-title {
    display: inline-block;
    height: 40px; 
    line-height: 40px; 
    font-family: Arial;
    font-weight: bold;
}


.pagehdr-title-icons {
    font-size: 25px;
}

.pagehdr-title {
    font-size: 40px;
}