最后两个字段集之间的奇怪差距

Question

当我在另一个字段集下方使用字段集时，我得到了一个奇怪的差距，但这不在我的代码中......

这是css：

fieldset { overflow:hidden }
.some-class { float:left; clear:none; }
.some-class1 { float:left; clear:none; }
.some-class2 { float:left; clear:none; }
.someclass { float:left; clear:none; }
.someclass1 { float:left; clear:none; }

这里是html：

<fieldset>
  <div class="some-class">
             <input type="button" value="AAN" style="float:left" onclick="POI(this)" />

    <input type="button" value="UIT" style="float:left" onclick="POI(this)" />
   <span>Spoortoegang </span>

 </div>
</fieldset>
<fieldset>
  <div class="someclass">
                 <input type="button" value="AAN" style="float:left" onclick="Storingen(this)" />

         <input type="button" value="UIT" style="float:left" onclick="Storingen(this)" />
  <span>Storingen</span>
 </div>
</fieldset>

<fieldset>
  <div class="Tekeningen-class">
             <input type="button" value="AAN" style="float:left" onclick="Tekeningen(this)" />

    <input type="button" value="UIT" style="float:left" onclick="Tekeningen(this)" />
   <span>Tekeningen</span>

 </div>
</fieldset>

<fieldset>
  <div class="someclass1">
                   <input type="button" value="AAN" style="float:left" onclick="Ultrasoon(this)" />
<input type="button" value="UIT" style="float:left;" onclick="Ultrasoon(this)" />
  <span>Ultrasoon Rapporten</span>
 </div>
 </fieldset>

   <fieldset>
  <div class="some-class2">
                   <input type="button" value="AAN" style="float:left" onclick="Medewerkers(this)" />
<input type="button" value="UIT" style="float:left;" onclick="Medewerkers(this)" />
  <span>Medewerkers</span>
 </div>
</fieldset>​
 <fieldset style="margin:0px; padding 0px;">

 <ul class="dropdown">
 <div id="some-class1"">
    <li><a id="drivers" onclick="dropdown(this); return false;" class="dir" style="font size=18"">IRISSYS Data &#9660;</a>
        <ul id="driversmenu" class="sub" >
<fieldset style="background-color:#c5ccd3">            
            <li><a>  <div class="someclass">
                   <input type="button" value="AAN" style="float:left" onclick="irisvoertuig(this)" />
<input type="button" value="UIT" style="float:left;" onclick="irisvoertuig(this)" />
  <span>Voertuig Effect</span></a></li>
</fieldset>

<fieldset style="background-color:#c5ccd3">            
            <li><a>  <div class="someclass">
                   <input type="button" value="AAN" style="float:left" onclick="iriscombinatie(this)" />
<input type="button" value="UIT" style="float:left;" onclick="iriscombinatie(this)" />
  <span>Combinatie Parameter</span></a></li>
</fieldset>

<fieldset style="background-color:#c5ccd3">            
            <li><a>  <div class="someclass">
                   <input type="button" value="AAN" style="float:left" onclick="irishoogte(this)" />
<input type="button" value="UIT" style="float:left;" onclick="irishoogte(this)" />
  <span>Hoogte</span></a></li>
</fieldset>

<fieldset style="background-color:#c5ccd3">            
            <li><a>  <div class="someclass">
                   <input type="button" value="AAN" style="float:left" onclick="irisschift(this)" />
<input type="button" value="UIT" style="float:left;" onclick="irisschift(this)" />
  <span>Schift</span></a></li>
</fieldset>

<fieldset style="background-color:#c5ccd3">            
            <li><a>  <div class="someclass">
                   <input type="button" value="AAN" style="float:left" onclick="irisverkanting(this)" />
<input type="button" value="UIT" style="float:left;" onclick="irisverkanting(this)" />
  <span>Verkanting verschil</span></a></li>
</fieldset>

<fieldset style="background-color:#c5ccd3">            
            <li><a>  <div class="someclass">
                   <input type="button" value="AAN" style="float:left" onclick="irisspoorwijdte(this)" />
<input type="button" value="UIT" style="float:left;" onclick="irisspoorwijdte(this)" />
  <span>Spoorwijdte Verloop</span></a></li>
</fieldset>

<fieldset style="background-color:#c5ccd3">            
            <li><a>  <div class="someclass">
                   <input type="button" value="AAN" style="float:left" onclick="irisspoorstaaf(this)" />
<input type="button" value="UIT" style="float:left;" onclick="irisspoortaaf(this)" />
  <span>Spoorstaaf Slijtage</span></a></li>
</fieldset>
<fieldset style="background-color:#c5ccd3">            
            <li><a>  <div class="someclass">
                   <input type="button" value="AAN" style="float:left" onclick="irissporen(this)" />
<input type="button" value="UIT" style="float:left;" onclick="irissporen(this)" />
  <span>IRISSYS Sporen</span></a></li>
</fieldset>

       </ul>
    </li>
        <div>

    </ul>
  </fieldset>

在chrome的元素检查员中，我得到了这个：

有谁知道我做错了什么？ 非常感谢您的帮助。

提前致谢

Answer 1

<强>解答：

在字段集之间放置一个不可见的字符，有些字符呈现为红点。

​

删除它，你的问题就会消失。

http://jsfiddle.net/hsRSD/1/或在您的jsFiddle中删除：http://jsfiddle.net/KPTXR/1/

我删除了另一部分以便于查找。

 <fieldset>
    <span>Medewerkers</span>
 </fieldset>​  <-- It is here, but only seen in jsFiddle
 <fieldset style="margin:0px; padding 0px;">


  </fieldset>

<强>建议：

然后在您的代码中，您会遇到双引号的问题：

 style="font size=18""   <-- remove the duplicate

（实际上CSS是font-size: 18px）

然后注意不要与其他元素嵌套UL。我可以告诉许多问题，这些问题来自于直接在UL下使用LI以外的其他元素。

 <ul id="driversmenu" class="sub" >
     <fieldset style="background-color:#c5ccd3">      <-- THIS will likely cause problems!    
        <li><a>  <div class="someclass">
            <input type="button" value="AAN" style="float:left" onclick="irisvoertuig(this)" />
            <input type="button" value="UIT" style="float:left;" onclick="irisvoertuig(this)" />
            <span>Voertuig Effect</span></a>
        </li>
     </fieldset>

如果必须将字段集放在LI之后：

  <ul id="driversmenu" class="sub" >
     <li>
        <fieldset style="background-color:#c5ccd3">          
        <a> <-- what does this do?
          <div class="someclass">
            <input type="button" value="AAN" style="float:left" onclick="irisvoertuig(this)" />
            <input type="button" value="UIT" style="float:left;" onclick="irisvoertuig(this)" />
            <span>Voertuig Effect</span></a>
        </fieldset>
     </li>