Угловой вертикальный маршрутизатор. Прокрутка ссылок сталкивается с горизонтальным переполнением страницы. Есть ли обход ⇐ CSS

[Anonymous]

Я использую Angular 17 и хочу реализовать прокрутку к верху страницы после нажатия на ссылку routerLink. После реализации классического ScrollPositionRestoration для ProvideRouter в app.config.ts и некоторых копаний я обнаружил, что overflow-x: скрытый в теле конфликтует с некоторыми функциями, лежащими в основе ScrollPositionRestoration, и это сработало как шарм. Но проблема в том, что я не хочу избавляться от overflow-x: скрытого тела, потому что тогда угловое веб-приложение перемещается влево и вправо на мобильном телефоне. Существуют ли какие-либо обходные пути, чтобы сохранить overflow-x: скрытым в теле и заставить работать ScrollPositionRestoration? (лучшее из обоих миров)?
Мой Angular 17 app.config.ts:

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

export const appConfig: ApplicationConfig = {
providers: [
provideRouter(
routes,
withInMemoryScrolling({
scrollPositionRestoration: 'enabled',
}),
withViewTransitions()
),
provideClientHydration(),
provideHttpClient(withFetch()),
importProvidersFrom([
BrowserModule,
BrowserAnimationsModule,
NoopAnimationsModule,
provideFirebaseApp(() => initializeApp(environment.firebaseConfig)),
provideAnalytics(() => getAnalytics()),
]),
],
};

Я также попробовал «top» вместо «enabled».
Мой фрагмент файла Styles.css:

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

html,
body {
position: relative;
width: 100%;
height: 100%;
margin: 0;
padding: 0;
background-color: var(--main-light-color);
font-family: var(--primary-font);
scroll-behavior: smooth;
scrollbar-width: none;
width: auto !important;
overflow-x: hidden;
}

Эти двое сталкиваются, как упоминалось выше.

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