My <section> is in the top of my <nav>, as far as I know <nav> is in top of <section> - html

Question

SO my <section> appears in te top of the <nav>, let say it will text wrap the <nav> section. How will I put the <section> below the <nav>
It gives me problem every time i put some text in and the text will appear behind the nav
body {
background-color: white;
}
table {
border-collapse: collapse;
width: 100%;
}
td,
th {
padding: 8px;
text-align: left;
border-bottom: 1px solid #ddd;
}
header,
footer {
padding: 1em;
color: white;
background-color: grey;
clear: left;
text-align: center;
}
nav ul {
list-style-type: none;
padding: 0;
}
nav ul a {
text-decoration: none;
}
section {}
aside {
float: left;
}
aside.right {
float: right;
}
<header>
<img src="mf.png" alt="Mandaue Foam" align="left" style="width:180px;height:108.56px;">
<div style="text-align: right;">Search: <input type="text" name="Search" placeholder="Search Here"></br>
</br>
</br>
</br>
</div>
<div style="text-align: right;">AF No. : <input type="text" name="AF No." placeholder="AF No."></br>
</div>
<div style="text-align: right;">Asset No. : <input type="text" name="AF No." placeholder="Asset No."></div>
<div style="text-align: center; text"><strong> ACCOUNTABILITY FORM <strong></div>
</br>
</header>
<nav>
<div style='position:fixed;top:230px;left:100px;'><input type="radio" name="progress" id="progress1" value="1" tabIndex="1" onClick="ckChange(this)"> For Official Use </br></br>
<input type="radio" name="progress" id="progress2" value="1" tabIndex="1" onClick="ckChange(this)"> For use in showroom to be returned on <input type ="date"></br></br>
<input type="radio" name="progress" id="progress3" value="1" tabIndex="1" onClick="ckChange(this)"> For use in showroom not to be returned
<div style='position:fixed;top:230px;right:150px;'><input type="radio" name="progress" id="progress4" value="1" tabIndex="1" onClick="ckChange(this)"> For sample</br></br><div>
<input type="radio" name="progress" id="progress5" value="1" tabIndex="1" onClick="ckChange(this)"> On Loan </br></br>
<input type="radio" name="progress" id="progress6" value="1" tabIndex="1" onClick="ckChange(this)"> Other <input type="text" name="progress" id="progress6" placeholder="State the Purpose">
</nav>
<section>
</section>

Answer 1

Your html code is invalid. please check again, and that's what causes your above .
please look at jsfiddle for the full code.
https://jsfiddle.net/vLbmc6z9/
<header>
<div>
<img src="mf.png" alt="Mandaue Foam" align="left">
</div>
</header>