0

我有一个在 div 内的表单,我想做的是在该表单下放置一个表格以显示一些结果。问题是,如果我在浏览器中的表单代码之后写任何标签,它会显示在表单的右侧而不是表单的下方。我需要做什么?这是CSS的东西吗?这是html代码和CSS:

<div style="width:55%;height:auto;margin-right:0px;" class="BuscarCliente">
  <form class="buscarForm" name="buscarClienteForm" method="get">
       <label class="formTitle">Buscar Cliente</label>
       <br><br>
       <label class="buscarForm">Ingresa el nombre del cliente a buscar:</label><br>
       <input class="buscarForm" style="width:200px;margin-top:7px;"type="text" name="nombre_cliente"><br><br>
       <input class="buscarForm" type="button" value="Buscar Cliente" onClick="JAVASCRIPT:form.submit()">
    </form>  

   <br><br><span>THIS STUFF SHOULD BE BELOW</span>
</div>

这是CSS

form.buscarForm{
   color:#486288;
   font-family: 'Source Sans Pro', Helvetica, sans-serif;
   font-size:16px;
   font-weight: 200;
   margin-left:35px;
   margin-top: 15px;
   float: left;
}
4

2 回答 2

4

您的float: left;css 规则指示浏览器将您的表单布局为浮动。之后出现的任何内容都会显示在右侧,除非它太大而无法容纳。如果不需要,可以删除该规则,或者您需要使用clear: both;css 规则设置下一个元素的样式。

此外,<span>标签默认显示为内联,因此您还需要在具有clear: both;规则的浮动表单之后添加一个块元素。 <div>是常见的块元素。

这是一种方法:http: //jsfiddle.net/HgWgT/

于 2013-02-06T21:04:12.727 回答
1

添加style="clear: both;到表格之后的下一个元素,然后它将位于左侧。

于 2013-02-06T21:05:12.220 回答