How to arrange the buttons with a given z-index -1?

Question

CMS

Good day friends.
The question is with the location of the buttons in the hblock block, which has the z-index property set to 1, because the buttons are in this block, they are not active, not usable, and when hovering over, the :hover property will not change anything,
I thought to solve this problem using position: absolute , but the slider block is set to display only on the main page, and when you follow the site links, the block with the icons-line buttons leaves.
code for absolute positioning:

<div class="hblock"> 
    </div>
     <div class="icons_line">
               <div class="wrp_hcat click buying_up"><a href="#"></a></div>
                <div class="wrp_hcat click apple"><a href="#"></a></div>
                <div class="wrp_hcat click modding"><a href="#"></a></div>
                <div class="wrp_hcat click dir_but"><a href="#"></a></div>
     </div>

.icons_line {
    position:absolute;
    top:620px;
    width: 100%;  
    height:150px;
}
.hblock {
    height:150px;
    width:100%;
    background: url('../images/bg_blur.jpg') center repeat-y fixed;
    background-attachment: fixed;
    position:relative;
    z-index: -1;
    background-size: cover;  
}

how can this problem be solved? where to dig and is it possible to do without absolute positioning here?

Answer 1

Don't use z-index for this block, only for buttons and other blocks that should overlap it.
Why is this so:
when a z-index is prescribed for an outer block, for all other blocks surrounding it, it, along with its internals, is on the same level.

Answer 2

In hblock, I created 1 more div to which I set the background style parameters with z index , hblock set the position relative and centered the icons_line relative to it.
Thanks Olga, but I thought of this method a little earlier :)