My Nav bar keeps going above my header

I have nothing else on the page except for a header and within in it is

header h1> some text h1> nav> ul> li> 1 </li> li> 2 </li> li> 3 </li> ul> nav>

header (wrote it like that because it worn show up on the forum as code)

CSS

h1 { font-family: 'VT323', sans-serif ; text-align: center; width: 16em; position: absolute;

}

nav {

text-align: center; }

nav ul { list-style: none; margin: 0 10px; padding: 0; display:inline-block;

}

I cant figure out the problem? Isnt h1 a block element? so automatically it goes with the flow of the document? Why is the nav bar going on top of the h1?