1.如果li横排用display:inline-block; 则li之间不能有间隔 必须连着一起,所以才一般用float:left;

.today-wrap{
position: relative;
background: $white;
height: 220px;
padding-top: 40px;
padding-bottom:40px;
li{
float: left;
width: 50%;
&:last-child{
&:before{
content: '';
position: absolute;
left:50%;
width: 1px;
height: 80%;
top:20px;
background:$grey;
}
}
}
.today-recommend{
text-align: center;
color: $blue;
.recommend-num{
font-size: 56px;
}
.recommend-unit{
font-size: 24px;
}
.recommend-name{
font-size: 26px;
color:$grey;
}
} }

  

<div class="today-wrap">
<ul>
<li class="today-recommend">
<a href="#">
<div>
<span class="recommend-num">32</span>
<span class="recommend-unit">笔</span>
</div>
<div class="recommend-name">
今日推广订单
</div>
</a>
</li>
<li class="today-recommend">
<a href="#">
<div>
<span class="recommend-num">260.00</span>
<span class="recommend-unit">元</span>
</div>
<div class="recommend-name">
今日获得收益
</div>
</a>
</li>
</ul> </div>

  

display inline-block 间隔的更多相关文章

  1. display:inline block inline-block 的区别

    原文地址:http://blog.csdn.net/jly036/article/details/5506182 display:block就是将元素显示为块级元素. block元素的特点是: 总是在 ...

  2. display:inline、block、inline-block的区别

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度不设是它的容器的100%,除非设定一个宽度 <div& ...

  3. display:inline; display:block;

    block(块级元素): div .from. p .table. pre.h1~h6. dl .ol .ul等 inline(内联元素): span.a.strong.em.label.input. ...

  4. display:block、display:inline与displayinline:block的概念和区别

    总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素).block元素通 ...

  5. display:inline 和display:inline-block和display:block的区别

    之前讲过块级元素使用display:block 行内元素使用display:inline 那么今天我们就来区分一下display:inline,display:inline-block和display ...

  6. 理解display:inline、block、inline-block

    要理解display:inline.block.inline-block的区别,需要先了解HTML中的块级(block)元素和行级(inline)元素的特点,行内元素也叫内联元素. 块级元素 总是另起 ...

  7. display:inline 跟 display:block 跟 display:inline-block区别

    我来说句人话吧.display:inline; 内联元素,简单来说就是在同一行显示.display:block; 块级元素,简单来说就是就是有换行,会换到第二行.display:inline-bloc ...

  8. HTML5 display:inline、block、inline-block的区别--备用

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度 <div& ...

  9. display:inline、block、inline-block的区别(转)

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度 <div& ...

  10. display:inline,display:inline-block,display:block 区别

    之前一直迷惑于display:inline/inline-block/block的异同,在度娘谷哥的帮助下,突然有了一点思路. 按照网上的介绍,inline将对象转化为内联元素,block将对象转化为 ...

随机推荐

  1. ofbiz

    http://www.cnblogs.com/Ivan-j2ee/category/404613.html 本类别主要收集一些关于ofbiz的技术文档,包括一些原创文档

  2. 在Windows 8上安装SQL Server2012

    SQL Server 2012 的安装方法跟2008差不多,基本上都是点击下一步,不过在安装的时候可能会进度条一直停留在“正在启动操作系统功能”NetFx3””处不动,出现这个问题的原因是在Windo ...

  3. AIO和NIO的理解

    AIO: AIO 背后的基本思想是允许进程发起很多 I/O 操作,而不用阻塞或等待任何操作完成,可以继续做 另外的事情,等I/O操作完成,内核会通过函数回调或者信号机制通知用户进程.这样很大程度提高了 ...

  4. UIPopoverController 简单用法(全代码)

     AppDelegate.m - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDic ...

  5. LightOJ 1258 Making Huge Palindromes (Manacher)

    题意:给定上一个串,让你在后面添加一些字符,使得这个串成为一个回文串. 析:先用manacher算法进行处理如果发现有字符匹配超过最长的了,结束匹配,答案就是该字符前面那个长度加上该串原来的长度. 代 ...

  6. vs2012 许可 tfs 许可

    Team Foundation Server 2012序列号或MSDN版本 BVGTF-T7MVR-TP46H-9Q97G-XBXRB VS2012注册码 亲测成功.我的是旗舰版... YKCW6-B ...

  7. <%@ include > 与< jsp:include >

    include指令表示在JSP编译时插入一个包含文本或者代码的文件,把文件中的文本静态地包含过去.也就是说,会把被包含的页面拷贝到包含的页面中指令所在的位置. 语法格式:<%@ include ...

  8. 关于Lucene分页标准

    public IEnumerable<SearchResult> Search(string keyword, string[] fieldNames, int pageSize, int ...

  9. 标准库函数begin和end------c++primer

    尽管能计算得到尾后指针,但这种用法极易出错.为了让指针的使用更简单.更安全,c++新标准引入了两个名为begin和end的函数.这两个函数与容器中的两个同名成员功能类似,不过数组毕竟不是类类型,因此这 ...

  10. 异常上报功能Bugly简介

    目的:为了能够快速定位到线上版本bug位置,经过比较之后,决定使用腾讯家的Bugly. 1.注册产品 官方文档使用指南 1.1 登录 - 使用 QQ 登录Bugly官网 没有账号就注册,要实名就实名, ...