li中的span设置float:right不生效

本文主要是介绍li中的span设置float:right不生效，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

li中的span设置float:right不生效：

部分html代码如下：

<li><span id='one'></span><span id='two'></span>
</li>

部分css代码如下：

li{display:block;
}
#one{float:left;
}
#two{float:right;
}

本意是想让两个span在li中，第一个span左浮动，第二个span右浮动，结果第二个span右浮动没生效，显示的结果还是左浮动

解决方法：
在li的css中设置一个属性height，即将li的属性display:block和height一起设置，里面的span设置浮动才生效。

li{ display:block;height:30px;
}
#one{float:left;
}
#two{float:right;
}

span设置margin不生效

html如下：

  <div id="filePanel"><button id="selectFileBtn">选择文件</button><span>支持文件格式：txt，xsl，csv</span><br /><span style="display:inline-block">参与抽奖的嘉宾人数：<i id="number">20</i><a href="#">查看</a></span></div>

解决方法：给span添加属性display:inline-block就可以给span标签设置margin   padding属性了

span的css如下：

font-size: 12px;
margin-left: 127px;
margin-top: 8px;
display:inline-block

这篇关于li中的span设置float:right不生效的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---