JSFiddle - React, Tailwind, and code Playground

by mkdizajn

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/holder/2.8.0/holder.min.js"></script>
<body>
<div class="header">
	<div class="title">SOME TEXT</div>
	<div class="containter">PAGE CONTENT</div>
</div>
</body>

CSS

body{
    margin:0; padding:0; height:100%; position:relative;
}
.header{
  display:table;
  background-image:url('https://placeholdit.imgix.net/~text?txtsize=28&bg=0099ff&txtclr=ffffff&txt=2800%C3%97800&w=2000&h=800&fm=png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 100%;
  width: 100%;
}