码迷,mamicode.com
首页 > 其他好文 > 详细

flex布局中同一行内对齐左右两端

时间:2019-11-02 12:14:53      阅读:191      评论:0      收藏:0      [点我收藏+]

标签:bsp   实现   span   sof   浮动   不能   mic   功能   com   

之前实现左右对齐都是用的float,但是用float经常会出现浮动影响,有时候清浮动也不能完全消除影响,后来用了flex之后觉得挺好用,不存在这个问题,所以现在都是能用flex就用flex,以下是用flex替代float实现左右对齐的代码
<div class="lh" style="padding: 20px 0;">
    <div style="display: flex;flex-flow: row nowrap;justify-content: space-between;background-color: white;padding: 10px;">
        <span>2017中国服务机器人大赛‘</span>
        <span>2019-11-01</span>
    </div>
</div>

 

最终效果如下(专注实现功能,所以页面比较简陋。。。)

技术图片

 

 

flex布局中同一行内对齐左右两端

标签:bsp   实现   span   sof   浮动   不能   mic   功能   com   

原文地址:https://www.cnblogs.com/yite/p/11780767.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!