请问我页面两个父辈div，如果都是用float: left, 然后设置margin，为什么第二个div内部就会多出来一个缝隙

<style>
.aa, .aaa {
                width: 50px;
                height: 25px;
                border: 1px solid black;
                font-size: 0;
                overflow: hidden;
                position: relative;
                margin: 0;
                padding: 0;
                font-size: 0;
                cursor: pointer;
            }
            .aa {
                margin-bottom: 5px;
            }
            .aaa {
                margin-top: 5px;
            }
            .bb  {
                width: 100%;
                height: 100%;
                background: #66CCFF;
                position: absolute;
                top: 15px;
                transition: all .5s;
                -moz-transition: all .5s;
                -webkit-transition: all .5s;
                -o-transition:all .5s;
                z-index: -1;
            }
            .bbb {
                width: 100%;
                height: 13px;
                background: #66CCFF;
                position: absolute;
                top: 25px;
                transition: all .5s;
                -moz-transition: all .5s;
                -webkit-transition: all .5s;
                -o-transition:all .5s;
                z-index: -1;
            }
            .ccc {
                width: 100%;
                height: 13px;
                background: #66CCFF;
                position: absolute;
                top: -25px;
                transition: all 1s;
                -moz-transition: all 1s;
                -webkit-transition: all 1s;
                -o-transition:all 1s;
                z-index: -1;
            }
            p {
                position: absolute;
                margin: 0 2px;
                bottom: 0;
                font-size: 20px;
            }
        </style>

                <div class="aa" id="aa">
            <div class="bb" id="bb"></div>
            <p class="p1">Click</p>
        </div>

        <div class="aaa" id="aaa">
            <div class="bbb" id="bbb"></div>
            <p class="p2">Click</p>
            <div class="ccc" id="ccc"></div>
        </div>

浏览器的像素问题，不用管，表格设置合并边框也会有这种问题