Question

我有以下HTML代码：

<a href="#">
 <span class="span1">test</span><span class="span2">test</span>
</a>

和css代码：

.span1{float: left; }
.span2{float: right; }

因此链接为test test，两个单词“test”和“test”之间的空间大约为40px。我只是通过使用css创建空间，而不是通过 或使用键盘输入空格。

单词“test”和“test”都是可点击的，但它们之间的空间不是。

如何使两个跨度之间的空间可点击？我试图将两个span标签包装在另一个span标签中，但没有帮助。

谢谢。

Answer 1

由于span被迫进入block显示（因为已经为其提供了float属性），因此您需要确保a也有block 1}}显示和overflow: hidden或clearfix，以确保完全包含其内容占用的空间（和居间空间）：

a {
    display: block;
    *zoom: 1;
}
a:after {
    clear: both;
    content: " ";
    display: table;
}
.span1 {
    float: left;
}
.span2 {
    float: right;
}

编辑：基于IE7中报告的奇怪现象：

*+html a * {
    cursor: pointer;
}

链接中两个跨距之间的空间是不可点击的

1 个答案: