How can I achieve the following layout?

Question

I'm not too concerned about the "Content" areas, more just the nav bar. I haven't done any work with drop down menus before. Also my current attempts are failing miserably, my hamburger icon is very out of place, it seems like it has some sort of invisible margin on top of it. Then my title text sticks to the very top of the nav bar.

a:link, a:hover, a:active, a:visited {
 	text-decoration: none;
 	color: inherit;
 }
 

div.nav {
	width: 100%;
	background-color: #1c1c1c;
	color: white;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin-top: 0;
	height: 50px;
}



.nav h1 {
	text-align: center;
	margin: 0 auto;
	font-size: 1.5em;
	position: fixed;
	top: 0;
	left: 50%;
	right: 50%;
}

.nav h2 {
	text-align: left;
	color: white;
	position: fixed;
	top: 0;
	left: 2%
}

li.dropdown {
	text-align: left;
}

div.dropdown-content {
	display: none;
}

	<div class="nav">
		<h1>Title</h1>
		<h2>☰</h2>

	</div>

Answer 1

a:link, a:hover, a:active, a:visited {
    text-decoration: none;
    color: inherit;
 }
 

div.nav {
    width: 100%;
    background-color: #1c1c1c;
    color: white;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin-top: 0;
    height: 50px;
}



.nav h1 {
    text-align: center;
    margin: 0 auto;
    font-size: 1.5em;
    position: fixed;
    top: 0;
    left: 50%;
    right: 50%;
}

.nav h2 {
    text-align: left;
    color: white;
    position: fixed;
    top: 0;
    left: 2%
}

li.dropdown {
    text-align: left;
}

div.dropdown-content {
    display: none;
}
.content{
  display: inline-block;
  width: 45%;
  height: 200px;
  border: 2px solid black;
  border-radius: 10px;
  margin: 60px 10px 0 10px;
  text-align: center;
}

    <div class="nav">
        <h1>Title</h1>
        <h2>☰</h2>

    </div>

    <div>
        <div class="content">
            content
         </div>
        <div class="content">
            content
         </div>
    </div>

Answer 2

The best advise I can offer at this stage of your development is that you learn about CSS resets. http://sixrevisions.com/css/css-reset-stylesheets/ explains more. By resetting styles to a "zero" position (across all browsers) you can start your project with some consistency.