JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
			<div class="oss-gradient">
			</div>
			<div class="header">
				<div class="logo">
				</div>
				<div class="oss-text">
					App name App name App name App name App name App name App name App name App name App name App name App name App name App name App name App name App name App name App name App name 
				</div>
				<div class="logout">
					<a href="#">Logout</a>
				</div>
				<div class="help">
					<a href="#">Help</a>
				</div>
			</div>
			<div class="content-wrapper">
			</div>
		</div>

CSS

body {
			margin: 0px;
		}
		.oss-gradient {
			height: 5px;
			min-width: 1024px;
			background: yellow;
		}
		.header {
			height: 40px;
			min-width: 1024px;
			background: #def;
		}
		.logo {
			background-image: url("logo_top_small.png");
			background-repeat: no-repeat;
			background-position: center center;
			background-attachment: scroll;
			width: 50px;
			height: 100%;
			float: left;
		}
		.help {
			line-height: 35px;
			float: right;
			height: 100%;
			width: 50px;
		}
		.logout {
			line-height: 35px;
			float: right;
			height: 100%;
			width: 60px;
		}
		.oss-text {
			line-height: 35px;
			height: 100%;
			overflow: hidden;
			float: left;
			width: calc(100% - 50px - 50px - 60px);
		}
		.content-wrapper {
			width: 1024px;
			background: #defabc;
			margin: 0px auto;
		}