如何解决inline-block缝隙问题

作者: 茶叶面包 | 来源:发表于2017-05-26 17:32 被阅读0次

1.三行换成一行让html元素没有间隔

    <li>按钮</li>
    <li>按钮</li>
    <li>按钮</li> 
    <li>按钮</li><li>按钮</li><li>按钮</li>

或者换成

    <li>按钮</li
    ><li>按钮</li
    ><li>按钮</li>

2.负magin值

    magrin-left：-4px；

第一个会超出来解决方法：

    .box>li:first-child{magrin-left:0;}

3.浮动元素

    float：left

必须清除浮动父元素添加

    overflow：auto;

4.父容器设0（最简单）

    font-size:0;

如何解决inline-block缝隙问题
1.三行换成一行让html元素没有间隔或者换成 2.负magin值第一个会超出来解决方法： 3.浮动元素 ...
css样式2
inline-block有什么特性？如何去除缝隙？高度不一样的inline-block元素如何顶端对齐? inli...
解决 inline-block 的左右缝隙问题
当元素是非块级元素（span，a等，或者display: inline;(display: inline-bl...
div布局
display：inline-block布局缺点：有空格缝隙，排版犬齿不齐空格解决：letter-spaceing...
inline-block的缝隙
inline-block的缝隙元素加inline-block之后默认右边是有缝隙的，如果在子元素设置font-s...
inline-block特性及如何解决去除缝隙
特性：内联块元素即具有行内元素特性又具有块级元素的特性：（1）元素之间可以水平排列（2）可以当做一个块级元素来设...
inline-block、空白、导航条
第一部分 inline-block一、inline-block之间的缝隙(inline-block再ie8以下版本...
inline-block缝隙
除去inline-block的几种常见的方法： 1、将所有的li标签放置在一行，中间没有空格。 2、把设置inbl...
Vue中菜单设置 display:inline-block;有上
Vue中菜单设置 display:inline-block;有上下缝隙解决方案:如果存在左右方向的间距，需要在父...
浮动与display:inline-block
显示方式 inline-block 默认为行内块级元素，所以之间会有缝隙。对齐方式 inline-block 没...