在li标签里面添加内容产生间距

Question

<div class="group-content">

                <div class="group-box">

                    <ul>

                        <li class="one">

                            <div class="group-info">

                                <span>魅蓝note6 64GB</span>

                                <span>官方正品</span>

                                <span>￥--</span>

                                <span>剩余：0天0小时0分0秒</span>

                            </div>

                            <div class="picture"></div>

                        </li>

                        <li class="two">

                        </li>

                        <li class="three"></li>

                    </ul>

                </div>

            </div>

css部分：

.group-box{

     font-size: 0;

 }

.group-box li{

     display: inline-block;

     font-size: 16px;

     width: 400px;

     height:174px;

 }

 .one{

     background: pink;

 }

 .two{

    background: paleturquoise;

 }

 .three{

     background: peru;

 }

 .group-info{

     display: inline-block;

 }

结果：

问题：

是什么造成第一个li产生间距？

Answer 1

给.group-box li设置一个float：left就好了