iOS safari scrolls pages upwards / incorrect css syntax when headlines are used?

[christianhorn]

Describe the bug When certain pages are opened on iOS and the user attempts to scroll down, the page is automatically scrolling back.

To Reproduce

hugo new site blog-test --format yaml
cd blog-test
git clone https://github.com/amazingrise/hugo-theme-diary themes/diary
echo 'theme: diary' >> config.yaml
sed -ie 's,baseURL.*,baseURL: https://blogtest.fluxcoil.net/,' config.yaml
mkdir content/posts
cat >content/posts/repro.md<<EOT
---
title: "Repro"
date: 2023-09-18T13:52:04+02:00
draft: false
---

## Background

Test text
EOT
hugo

Then, configure a reverse proxy (nginx here) to deliver blog-test/public as URL blogtest.fluxcoil.net. Then open https://blogtest.fluxcoil.net/posts/repro/ on an iOS device with safari, using an iphone here. Then scroll down the page.

Expected behavior The page should scroll down.

Environment hugo v0.111.3+extended linux/amd64 BuildDate=2023-03-16T08:41:31Z VendorInfo=debian:0.111.3-1 (the build from Debian bookworm) safari iOS 17.4.1

Additional context The issue does not happen with theme ananke. Example URLs: https://blogtest.fluxcoil.net/posts/repro/ and https://blog.fluxcoil.net/posts/2023/09/moving-flat-in-tokyo/ (the latter one is where the issue was reported, the first one is the minimal reproducer). Seems like the theme is producing incorrect syntax when sections ("## Background" here) are used. A "

[christianhorn]

Must be something else with the code generated by the theme. I took out quite some elements which a syntax checker flagged as errors, but iOS/safari still keeps browsing up: https://blogtest.fluxcoil.net/posts/repro3/ .

[christianhorn]

I suspect now it's a Safari issue. Even with all syntax errors fixed (at least with the syntax checker I used), Safari/iOS behaves like this.