Генрих Ройзман, что вы ожидаете увидеть, скажите, пожалуйста? Я убрал у body ненужный margin auto и поставил его для .container. Все работает так, как и должно:
Слушайте, ну ведь правда, что вы ожидаете без скриншотов того, как оно есть, и того, как оно надо? Уже 100 лет есть тот же https://ru.imgbb.com/ в качестве хостинга растровых картинок и песочница а-ля https://jsfiddle.net/, куда надо кидать ваш код.
В таком виде это никуда не годится. Как вижу, у вас там локальные пути, поэтому ссылку на сайт даже не прошу. Сделайте песочницу.
test-cats, берите безопасное разрешение — 1360px. Сайт выглядит на нём не так красиво, зато более приближено к реальности. Но в любом случае, учитывать в процессе нужно будет все возможные разрешения.
Избавиться от проблемы, когда фокус скролла перехватывается на body в iOS Safari, вы не сможете (типа вы крутите, а ничего не происходит). Но закрепить положение body — можно.
Для разработки интерфейсов берут за референс устройства. От него и отталкиваются.
Если о сайтах, то показывать макет десктопа обычно сейчас принято в 1920×1080px (второе по популярности разрешение). При этом самым популярным разрешением по факту является 1360×768px. Это без учёта интерфейса браузеров, конечно.
AlexBergal, я уже понял, что вам по силу сделать на CSS даже AJAX-запрос, поэтому мне доказывать более ничего не нужно. Преклоняюсь.
Пагинация на CSS ≠ пагинации. И ею быть не может. Если у вас получился костыль на CSS — поздравляю.
Я так делал однажды сортировку фильтров на CSS с помощью :checked и flex-order. Но предоставлять это решение как решение проблемы сортировки, которую нужно делать на JS, как все нормальные люди, — это стыдно. Ваша CSS-пагинация — тот же случай.
Лучше опишите, что вы хотите получить в итоге.