Фоновое изображение: проблема с repeat-y только в представлении списка категорий

Используя код Dax’а code с параметром background-repeat, установленным в значение “repeat-y”, я загрузил на Imgur изображение чистого листа бумаги в высоком разрешении, предварительно масштабировав его до 1920x1440. Поведение кажется нормальным на первый взгляд, за исключением представления списка категорий, где изображение не масштабируется и/или не повторяется по вертикали. Однако я заметил, что при уменьшении масштаба в представлении категорий, где фоновое изображение действительно казалось масштабируемым, оно перестало масштабироваться после уменьшения до 75%.

Проблема с заголовками, я полностью уверен, не решаема. Не стоит беспокоиться об этом. Честно говоря, я сомневаюсь, что буду использовать эту функцию фоновых изображений, но хотел указать на эти моменты в любом случае.

Редактирование: представление темы поста, похоже, работает нормально, как показано ниже. Странные цвета, потому что я пока только тестирую это на предмет осуществимости (сайт еще не запущен). Проблема с заголовками, как отмечено выше, вероятно, является основной причиной, по которой я откажусь от использования изображения (а также из-за читаемости текста в некоторых случаях).

1 лайк

Предполагаю, что из-за короткого контента на странице #main не занимает 100% высоты окна. Заполняет ли фон всю страницу, если добавить #main { height: 100vh; }? Также можно перенести фоновое изображение на тег HTML.

3 лайка

Вот и всё! Спасибо вам дважды за два исправления сегодня! :grin:

Несколько слов о поведении: 100vh ничего не дало, а 1000vh привела к нежелательному поведению полосы прокрутки (она прокручивалась вниз в никуда). Значение 200 тоже казалось слишком большим расстоянием прокрутки, поэтому я увеличивал его с шагом 10. Забавно, что фон не дублировался, из-за чего внизу снова появился бежевый (обычный) фон. Это сохранялось до тех пор, пока я не достиг 140vh.

1 лайк