Как показать курсор на кнопке, которая находится внутри div?

Question

У меня есть кнопка, которая находится внутри 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 он не показывает мне курсор в виде руки, пока указатель достигает значка кнопки.

Я попытался изменить z-index двух делений и изменить курсор: указатель в css.

Я хочу курсор в виде руки при наведении на div также в firefox.

Answer 1

Просто используйте Padding вместо margin в pagination 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>

Answer 2

используйте этот css

.pagination:hover #getFilesButton{
cursor: pointer;
}

и обязательно поддержите любой конкретный c браузер для поддержки браузера о курсоре, вы можете проверить его здесь

Поддерживается курсор Caniuse

Надеюсь, это сработает. дайте мне знать, если вам нужна дополнительная помощь