JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
  <nav>
    <section class="navabout">
      ABOUT
    </section>

    <section class="navphotography">
      PHOTOGRAPHY
    </section>

    <section class="navdesign">
      DESIGN
    </section>
  </nav>
</div>

CSS

.container > nav{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.container > nav > section{
	width: 33%;
	height: 100%;
  float: left;
}
.container section.navabout{
	background: url(http://eofdreams.com/data_images/dreams/face/face-01.jpg) no-repeat center; 
  background-size: cover;
}
.container section.navphotography{
	background: url(http://www.digitaltrends.com/wp-content/uploads/2010/02/digital-camera-buying-guide-header.jpg) no-repeat center; 
  background-size: cover;
}
.container > nav > section.navdesign{
	background: url(http://media.peugeot.com/images/backgrounds/design/concept-peugeot-design-lab.jpg) no-repeat center; 
  background-size: cover;
}