div标签里面的a标签不能跳转

div标签里面的a标签不能跳转：

昨天在写代码，发现重复的代码点击事件居然不能实现，进一步研究，发现连a标签不能跳转了。。
经过昨天一晚上和今天，终于找到了解决办法，但是没有找到原因，想不通啊。

先看大概代码吧：

<div id="eight">
                <img src="{{recps.7.4}}" class="photo" width="270" height="200" style="display: inline;"/>
                <dl>
                    <dt style="margin: 5px 50px ">
                        {% if flag08 == '0' %}
                            <i class="icon-xihuan iconfont love-black love-black-08"></i>
                         {% else %}
                            <i class="icon-xihuan-copy iconfont love-red love-red-08"></i>
                         {% endif %}
                        {{recps.7.1}}:<a href="{{recps.7.3}}" style="text-decoration:none;color:blue"><span class="eight-title">{{recps.7.2}}</span></a>
                    </dt>
                </dl>
</div>
<div id="nine">
                <img src="{{recps.8.4}}" class="photo" width="270" height="200" style="display: inline;"/>
                <dl>
                    <dt style="margin: 5px 50px ">
                        {% if flag09 == '0' %}
                            <i class="icon-xihuan iconfont love-black love-black-09"></i>
                         {% else %}
                            <i class="icon-xihuan-copy iconfont love-red love-red-09"></i>
                         {% endif %}
                        {{recps.8.1}}:<a href="{{recps.8.3}}" style="text-decoration:none;color:blue"><span class="nine-title">{{recps.8.2}}</span></a>
                    </dt>
                </dl>
 </div>

大概代码就是这个类型
这里面的id=(one~eight)的a标签都可以跳转，点击事件也可以响应。
然而id=nine和id=ten的a标签不能跳转，点击事件也不响应。
id=eleven的a标签可以跳转，但点击事件不能响应。
id=twelve的a标签可以跳转，点击事件也可以响应。

（注意：这些的标签的点击事件也都是一个模子的。）

我反复的排查，代码都检查了好多遍，确定不会错了。看来网上的办法，大多不能解决我的问题。没办法，只能一个试了，慢慢的把怀疑的注释掉，在注释回来，看网页的变化。终于，我发现是它的css文件的原因。

#eleven
{
    width:270px;
    margin-top: 50px;
    margin-left: 40px;
    /*background: rgba(160,32,240,0.6);*/
    /*height:200px;*/
    float: left;
}

如上，把height给注释掉，就都正常了，但是我还是没想通原因，我也没有超出标签的框子啊…