как поместить градиент в мою хлебную крошку, если он перенес переполнение?

Question

Мне нужно добавить градиент на мою хлебную крошку в главном div, но я не могу оставить его включенным, как этого требует команда UX.

ссылка правильного и неправильного https://imgur.com/a/9XQCd7H

Я поставил css-код для создания градиента, но не могу сделать его прозрачным и не поверх хлебных крошек

background: linear-gradient(90deg, white 0%, rgba(255, 255, 255, 0)), linear-gradient(-90deg, white 0%, rgba(255, 255, 255, 0)) 100% 0, linear-gradient(90deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0)), linear-gradient(-90deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0)) 100% 0;
    background-repeat: no-repeat;
    background-color: #fff;
    background-size: 100px 100%, 100px 100%, 9px 100%, 9px 100%;
    background-attachment: local, local, scroll, scroll;