时间戳

首页 > 解决方案 > 如何在 div 内的按钮上显示手形光标？

html - 如何在 div 内的按钮上显示手形光标？

问题描述

我有一个在 div 里面的按钮

.calculateActivityBtn {
    float: left;
    margin-right: 1px;
    cursor: pointer;
}

.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px;
    cursor: pointer
}
<div class="calculateActivityBtn">
    <div class="pagination centered">
        <div class="btn btn-primary" id="getFilesButton" title="<%= language['UI.reports.tooltip.getFilesButton'] %>"><i class="glyphicon glyphicon-stats">button text</i></div>
    </div>
</div>

当我将鼠标悬停在 div 上时，它会在 chrome 中给我一个手形光标，但在 Firefox 中，它不会向我显示手形光标，直到指针到达按钮图标。

我尝试更改两个 div 的z-index并更改光标： css 中的指针。

当我在 Firefox 中悬停在 div 上时，我想要一个手形光标。

标签： htmlcss

解决方案

只需使用而Padding不是.. 检查更新的片段...marginpagination div

.calculateActivityBtn {
    float: left;
    margin-right: 1px;
    cursor: pointer;
}

.pagination {
    display: inline-block;
    padding-left: 0;
    padding: 20px 0;
    border-radius: 4px;
    cursor: pointer;
    background: red;
}
<div class="calculateActivityBtn">
    <div class="pagination centered">
        <div class="btn btn-primary" id="getFilesButton" title="<%= language['UI.reports.tooltip.getFilesButton'] %>">
          <i class="glyphicon glyphicon-stats">button text</i>  
        </div>
    </div>
</div>

推荐阅读