HTML(ASP.NET)div在前面的div中而不是在它之后呈现

时间:2015-01-08 12:33:27

标签: c# html asp.net

我在aspx文件中有以下内容:

...
 <div class="graybg">
    <div id="clmn1">
       <div class="title2">Pick Up From:</div>
       <div id="pickup_options" class="selservice" runat="server">
          <div class="boxes">
             <asp:ImageButton class="box1" src="./box1.png" runat="server" OnClick="OnClickAddress" alt="Ground Address" />
             <div class="boxtitle">Ground Address</div>
          </div>
          <div class="boxes">
             <asp:ImageButton class="box1" src="./box2.png" runat="server" OnClick="OnClickAirport" alt="Airport" />
             <div class="boxtitle">Airport</div>
          </div>
       </div>
       <div id="pickup_airport" runat="server">
          <div class="rows">
             <div class="inputbtnholder">
                <asp:TextBox class="input1" ID="TextBox1" placeholder="Enter Flight Number" runat="server"></asp:TextBox>
                <div id="Div1_pkup" class="imgbtn searchbtn"></div>
             </div>
          </div>
          <div class="rows">
             <asp:TextBox class="input1 martop" ID="TextBox2" placeholder="Airport" runat="server" />
             <div id="airport_search" class="imgbtn searchbtn" />
          </div>
          <div class="rows">
          <div class="inputbtnholder">
          <script type="text/javascript"> ...
          <asp:TextBox ID="pickupdatetime" class="input1 martop" placeholder="Select Date and Time" runat="server"></asp:TextBox>
          <div id="Div2_pkup" class="imgbtn datebtn"></div>
          </div>
       </div>
       </div>
       <div id="pickup_ground" runat="server">
          <div class="inphld">
             <asp:TextBox class="input1" ID="address" placeholder="Search for address" runat="server"></asp:TextBox>
             <div id="searchbtn" class="imgbtn searchbtn"></div>
          </div>
          <div class="inphld">
             <asp:TextBox class="input1 martop" ID="pickupdate" placeholder="Select Date and Time" runat="server"></asp:TextBox>
              <div id="datebtn" class="imgbtn datebtn"></div>
          </div>
       </div>
    </div>
 </div>
 <div class="selservice">
....

我所有的缩进匹配检查(手动和自动)告诉我,最后一行中的类selservice的div位于class graybg的div之后。当我在Chrome中发布并浏览页面时,渲染很混乱。使用chrome开发人员工具进行检查显示selservice遵循graybg中的clmn1。如果我删除定义&#34; airport_search&#34;的行,则渲染是正确的,并且开发人员工具会在grebbg之后显示selservice,就像它应该的那样。

任何人都能解释一下吗?

1 个答案:

答案 0 :(得分:2)

从自闭标签更改。即。

<div id="airport_search" class="imgbtn searchbtn" />

<div id="airport_search" class="imgbtn searchbtn"></div>