Does position:absolute set a negative value of right to increase the width of the parent element?

as shown in the following figure, the button of the activity rule, after setting a negative value of right, the page appears a horizontal scroll bar, just want to let part of the button out of the page, this can not be achieved, want to know why there is a scroll bar?

.btn-rule{
    display: inline-block;
    width: 1.9467rem;
    height: 0.6133rem;
    line-height: 0.6133rem;
    padding-left:0.2667rem;
    border-radius: 0.5333rem;
    -webkit-border-radius: 0.5333rem;
    background-color:-sharpffb840;
    top: 0.3067rem;
    right: -0.2667rem;
    position: absolute;
    font-size: 0.32rem;
    color:-sharpfff;
    letter-spacing: 0.0133rem;
}
Mar.28,2021

does not write overflow:hidden overflow is displayed by default. Your negative right increases the width of the visual area, so the scroll bar comes out

Menu