Разрывы повторяющегося линейного градиента в середине страницы [закрыто] ⇐ CSS

[Anonymous]

У меня есть HTML-страница с элементом . Этот раздел заполняется динамически, поэтому он может быть довольно длинным, особенно на мобильных устройствах, где экран намного уже.
Этот элемент раздела применяется с повторяющимся линейным градиентом как таковой:

Код: Выделить всё

.notebook {
background-image: repeating-linear-gradient(transparent 0px 20px, var(--DEEP-BLUE-OPACITY) 20px 21px);
}

Итак, HTML-код выглядит так:

Код: Выделить всё

Document

Это придаст элементу вид блокнота:


По какой-то причине только на мобильном устройстве (не на ПК), когда становится длиннее, повторяющиеся линейный градиент перестает проявляться. Я не могу понять, почему, как говорится в документации MDN:

Как и любой градиент, повторяющийся линейный градиент не имеет внутренних размеров; т. е. он не имеет ни естественного или предпочтительного размера, ни предпочтительного соотношения. Его конкретный размер будет соответствовать размеру элемента, к которому он применяется.

Кто-нибудь может помочь?

Подробнее здесь: https://stackoverflow.com/questions/792 ... le-of-page