我的<section>在我的顶部<nav>,据我所知<nav>在顶部<section>



所以我的<section>出现在<nav>的顶部,假设它将对<nav>部分进行文本换行。我将如何将<section>放在<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>

您的 html 代码无效。 请再检查一次,这就是导致您的上述原因。

请查看JSFIDDLE以获取完整代码。

https://jsfiddle.net/vLbmc6z9/

<header>
 <div>
  <img src="mf.png" alt="Mandaue Foam" align="left">
 </div>
</header>

最新更新