查询条件一行放不下，如何摆放

 　　在写页面的时候可能出现查询条件比较多一行放不下，怎么样才能看起来比较整齐美观呢，由于自己还处于学习阶段，很多东西不懂，只能到处百度，纠结了很久，只能暂时达到下面的效果：

<div>
　　<label for="name" style="display:inline-block;40px;text-align:right;">姓名</label>
　　<span style="display:inline-block;175px;">
　　　　<input id="name" name="name" type="text" class="form-control" style="align:left;" placeholder="请输入用户姓名" value="${fn:escapeXml(user.name)}">
　　</span>
　　<label for="sex" style="display:inline-block;50px;text-align:right;">性别</label>
　　　　<span style="display:inline-block;175px;">
　　　　　　<select id="sex" name="sex" type="text" class="form-control" style=" 175px;">
　　　　　　　　<option value="1" <c:if test="${user.sex=='1'}">selected="selected"</c:if> >男</option>
　　　　　　　　<option value="0" <c:if test="${user.sex=='0'}">selected="selected"</c:if>>女</option>
　　　　　　</select>
　　</span>
</div>
<div style="margin-top: 5px;">
　　<label for="phone" style="display:inline-block;40px;text-align:right;">手机号</label>    
　　<span style="display:inline-block;175px;">
　　　　<input id="phone" name="phone" type="text" class="form-control" style="align:left;" placeholder="请输入手机号" value="${user.phone}">
　　</span>        
　　<label for="cardNo" style="display:inline-block;50px;text-align:right;">身份证号</label>    
　　<span style="display:inline-block;175px;">
　　　　<input id="cardNo" name="cardNo" type="text" class="form-control" style="align:left;" placeholder="请输入身份证号" value="${user.cardNo}">
　　</span>    
</div>