清除左边会在firefox / chrome中产生间隙

时间:2013-04-15 18:09:52

标签: html css

我在html / css中变得非常生疏,当我在左侧创建一个新控件时,我在我的Web应用程序中引入了一个问题。

<div id="leftnav">
<ul><li class="saveAndExit"><a class="noflag" href="" onclick="">Save and Exit</a></li></ul>
<span id=""><ul><div><li><a id="" class="noflag" href="btn0','')" onclick="javascript:keepDirtyFlag();undefined">Introduction</a></li></div><div><li><a id="" class="noflag" href="" onclick="">Applicant Details</a></li></div><div><li><a id="" class="noflag" href=")" onclick="javascript:keepDirtyFlag();undefined">Applicant Details</a></li></div><div><li><a id="" class="noflag" href="" onclick="j">Applicant details – Trust</a></li></div><div><li><a id="" class="noflag" href="" onclick="javascript:keepDirtyFlag();undefined">Applicant contact person – Trust</a></li></div><div><li><a id="" class="noflag" href="" onclick="">Applicant Trustees</a><a onclick="" class="noflag arrow"></a><ul style="display:none"><li><a id="" class="noflag" href="" onclick="javascript:keepDirtyFlag();undefined">Record 1</a></li><li><a id="" class="noflag" href="" onclick="">Record 2</a></li></ul></li></div><div><li><a id="" class="noflag" href="" onclick="">Eligibility Details</a></li></div><div><li><a id="" class="noflag" href="" onclick="">Eligibility Details</a></li></div><div><li><a id="" class="noflag" href="" onclick="">Review</a></li></div></ul></span>
</div>

问题是,我有一个包含以下模板的字段的字段集

<div class="field-container"><div class="field-label"><label for="_Name_txt" id="mCtrl0_Name_txt_fieldLabel" accesskey="M">Na<u>m</u>e<span class="field-asterisk"><acronym title="Required">*</acronym></span></label><em></em></div><div class="field-control"><div class="field-wrapper-passive"><input name="ormCtrl0$Name_txt" type="text" id="mCtrl0_Name_txt" dtext="" class="field-text-idle"></div><div class="field-error-passive"><span id="mCtrl0_ctl06" style="color:Red;display:none;">A name is required</span><span id="mCtrl0_ctl07" style="color:Red;display:none;">The Name must not exceed 200 characters</span></div></div><div class="field-clear"></div></div>

自从我添加了新的leftnav控件以来,这是正确显示的,但现在,“field-clear”类

 .field-clear {
 clear: left;
 line-height: 1px;
 font-size: 1px;
 height: 1px;
 }

清除左侧的导航列表,并在第一个字段和表单内的其他字段之间创建一个巨大的间隙。我该如何解决这个问题?

编辑:JSFIDDLE http://jsfiddle.net/vS8jt/2/embedded/result/

1 个答案:

答案 0 :(得分:0)

这是通过浮动主容器然后添加一个新的div来解决的,该div在页面底部清除它。