float奇怪的地方

1 <div class="box">
2
3             <img src="public-img/286320.jpg" />
4
5             <span>X</span><span>22</span>
6
7  </div>

.box {
                /*width: 300px;*/
                /*height: 500px;*/

                background-color: red;
                overflow: hidden;
                /*神奇的事情，加入这个，拥有clearFix的功能*/
            }
            .box img {
                width: 100%;
                display: block;
                /*line-height: 0;*/
                /*float: left;*/
            }
            .box span {
                /*position: absolute;*/
                /*right: 0;*/

                width: 25px;
                height: 25px;
                display: inline;
                float: right;
                background-color: #00AFF2;
            }

float同时会让元素inline-block化，可以设置宽高