Как закрепить класс div при скроллинге?

У меня есть кнопки:

<div class="btt">
<a href='' class="buttonn"><br><strong>ПЕРВЫЕ БЛЮДА</strong></strong></a>
<a href='' class='buttonn'><br><strong>ВТОРЫЕ БЛЮДА</strong></a>
<a href='' class='buttonn'><br><strong>ГАРНИРЫ</strong></a>
<a href='' class='buttonn'><br><strong>ПИЦЦА</strong></a>
<a href='' class='buttonn'><br><strong>РОЛЛЫ</strong></a>
<a href='' class='buttonn'><br><strong>СЕТЫ</strong></a>
<a href='' class='buttonn'><br><strong>БУРГЕРЫ</strong></a>
<a href='' class='buttonn'><br><strong>ШАУРМА</strong></a>
<a href='' class='buttonn'><br><strong>НАГГЕТСЫ</strong></a>
<a href='' class='buttonn'><br><strong>САЛАТЫ</strong></a>
<a href='' class='buttonn'><br><strong>ВЫПЕЧКА</strong></a>
<a href='' class='buttonn'><br><strong>НАПИТКИ</strong></a>
</div>

и есть код css для их расположения и стиля:

.btt {
    float: left;
    width: 20%;
}

.buttonn {
    text-decoration: none;
    color: #000;
    font-size: 17px;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans 
Unicode', Geneva, Verdana, sans-serif;
    font-weight: 800;
    line-height: 40px;
    transition: color 0.3s linear;
    margin-right: 0px;
}





.buttonn:hover {
    color: #FF7400;
}

как сделать так чтобы при скроллинге, эти кнопки оставались там же? я уже пробовал position: fixed, если брать его, то кнопки просто исчезают.

update: я поставил position:sticky and left:0, но все равно не остается(

upd2: вставлял в класс .btt