为什么添加float：留给我的css使我的链接不可点击？

我有一个视图，其中定义了一个部分：

<div id="QuestionBody">
        <p><%=ViewData.Model.Body %></p>
        <div id="QuestionEditLink"><%=Html.ActionLink ("Edit","EditQuestion","Question",new {id=Model.QuestionId},null) %></div>
        <div id="QuestionHistoryLink"><%=Html.ActionLink ("History","ShowHistory",new {postId=Model.PostId,questionId=Model.QuestionId},null) %></div>  
        <div id="AnsweringUser"><a href="/Profile/Profile?userName=https%3A%2F%2Fwww.google.com%2Faccounts%2Fo8%2Fid%3Fid%3DAItOawnZ6IhK1C5cf_9wKstNNfSYIdnRp_zryW4">Answered by Sam</a></div>          
    </div>

这产生一个文本和一些链接的部分。我想让这些链接彼此相邻。我是css和web开发的新手，但是将其添加到我的样式表中：

#QuestionEditLink
{
    color: #666666;
    width:auto;
    float:left;
    padding:2px;
}

#QuestionHistoryLink
{
    color: #666666;
    width:auto;
    float:left;
    padding:2px;
}

而且他们的链接很好地对齐了。不幸的是，他们也是不可点击的，实际上，当移动它们时，光标不会改变。

那我做错了什么？如何使用css将两个链接对齐在一起，这样它们仍然可以点击？

编辑：

这个行为是在chrome 8.0.552.215和firefox 3.6中。它的工作原理，我期望在IE 8，令人烦恼。

EDIT2：

我已经将页面添加到JSBin：http://jsbin.com/odefa4/edit中，显示了该问题。只有问题的样式和显示问题，答案的链接工作正常…

解决方法

通常的原因是顶部有一个透明的层。通常情况下，盒子比您想象的更宽，并且具有透明的边框/填充。使用CSS将临时边框应用于所有项目，您将检查是否这样。

更新#1

div,span,p{
    border: 1px solid red;
}

更新#2

我可以看到#QuestionEditLink和#QuestionHistoryLink是浮动的。这意味着它们不再在页面流中使用空间。因此，当您显示#AskingUser时，它会在同一时刻开始，作为页面上的最后一个，它会显示在另外两个框的顶部。

你的布局似乎是完全垂直的。我假定你不需要任何浮动：离开了。

BTW，你有很多重复的ID。

原文链接：https://www.f2er.com/css/219258.html

为什么添加float：留给我的css使我的链接不可点击？

解决方法

猜你在找的CSS相关文章