html - 我可以删除这些跨度吗？

Question

我有这个 HTML/CSS 代码 ( JSBin ):

.trackTime{width:50px; text-align:left; float:left;}
.trackInputTime{width:45px; height:22px; background-color:#F4F4F4;}   

<span class="trackTime">            
    <select name="hours[]" class="trackInputTime" id="trackInputHours" >
        <option value="??">??</option>
     </select>
</span>

<span class="trackTime">            
    <select name="minuts[]" class="trackInputTime" >
        <option value="??">??</option>
    </select>   
</span>

<span class="trackTime">                            
    <select name="seconds[]" class="trackInputTime" >
        <option value="??">??</option>
    </select>
</span>

我想删除每个选择字段的跨度。试图删除跨度并编辑类(here 编辑后的版本):

.trackInputTime{width:50px; height:22px; background-color:#F4F4F4; text-align:left; padding-right:5px; float:left;}

但是有一个我不喜欢的白色背景..

输入提交按钮也是如此:

.trackBotton{width:75px; float:left; text-align:right;}

<span class="trackBotton"><input type="submit" value="+ Side" onClick="addSide(this);return false" /></span>
<span class="trackBotton"><input type="submit" value="+ Track" onClick="addTrack(this);return false" /></span>
<span class="trackBotton"><input type="submit" value="Remove" onClick="remTrack(this);return false" /></span>

我有很多这样的跨度，这就是为什么我想删除它们。

我该怎么做？无法添加 jsfiddle，因为它似乎处于离线状态:O

Answer 1

看起来您使用跨度在表单元素之间获得一些空间。您可以删除跨度并使用

.trackInputTime{width:50px; height:22px; background-color:#F4F4F4; text-align:left; margin-right:5px; float:left;}

你几乎就在那里，只需使用“边距”而不是“填充”。内边距是元素“内部”的额外空间，外边距。