Wie man den Körper unter iOS 26.1 (Safari) dazu bringt, den sicheren Bereich zu ignorieren ⇐ CSS

[Anonymous]

Ich möchte, dass eine Seite von oben nach unten beginnt. Das ist der grüne Bereich unter der oberen Statusleiste und der unteren IP-Adressleiste.
Hier ist das Quellcode-Repository:

• https://github.com/williamhqs/foo_safearea

Ich habe ein Plugin tailwindcss-safe-area ausprobiert, es funktioniert nicht.
Hier ist mein Hauptcode:
Page.tsx

Code: Select all

export default function Home() {
return ;
}

layout.tsx

Code: Select all

import type { Metadata } from "next";
import { Geist, Geist_Mono } from "next/font/google";
import "./globals.css";

const geistSans = Geist({
variable: "--font-geist-sans",
subsets: ["latin"],
});

const geistMono = Geist_Mono({
variable: "--font-geist-mono",
subsets: ["latin"],
});

export const metadata: Metadata = {
title: "Create Next App",
description: "Generated by create next app",
};

export default function RootLayout({
children,
}: Readonly) {
return (





{children}


);
}

global.css

Code: Select all

@import "tailwindcss";
@import "tailwindcss-safe-area";

:root {
--background: #ffffff;
--foreground: #171717;
}

@theme inline {
--color-background: var(--background);
--color-foreground: var(--foreground);
--font-sans: var(--font-geist-sans);
--font-mono: var(--font-geist-mono);
}

@media (prefers-color-scheme: dark) {
:root {
--background: #0a0a0a;
--foreground: #ededed;
}
}

body {
background: var(--background);
color: var(--foreground);
font-family: Arial, Helvetica, sans-serif;
}

Umgebung

• iOS 26.1
• Next.js v15.5.6
• TailwindCSS v4