JSFiddle - React, Tailwind, and code Playground

HTML

<div id="header">
    <div class="header-grid1">
        <div class="header-cell1">
            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Pariatur nesciunt eaque delectus earum rerum ipsam aliquid maiores suscipit soluta consequuntur provident non libero inventore obcaecati ullam praesentium et sunt fuga!
        </div>
        <div class="header-cell2">
            <div class="header-cell3">
                <img src="image.png" alt="text">
                <div class="flexcenter">
                    <a href="link">text</a>
                </div>
            </div>
            <div class="header-cell4">
                <img src="image.png" alt="text">
                <div class="flexcenter">
                    <a href="link">text</a>
                </div>
            </div>
        </div>
    </div>
</div>

CSS

.header-grid1 {
	display: flex;
}
.header-cell1 {
    flex-wrap: wrap;
    display: flex;
	flex: 0 0 66.666%;
	background-color: orange;
}
.header-cell2 {
    flex-wrap: wrap;
	flex: 0 0 33.333%;
    display: flex;
    flex-flow: column;
    text-align: center;
}

.header-cell3 {
	display: flex;
	justify-content: center;
	background-color: orange;
	flex: 0 0 auto;
}
.header-cell4 {
	display: flex;
	justify-content: center;
	background-color: orange;
	flex: 1 0 auto;
}