Почему добавление float:left в 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","Question",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 и веб-разработке, но добавил это в свою таблицу стилей:

#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, которая показывает проблему. Только вопрос стилизовывается и показывает проблему, ссылки на ответы работают нормально...