所以我使用 Tailwind CSS,但遇到了问题。所以我正在学习如何在顺风 CSS 上进行滚动捕捉。滚动对齐 y 有效,但滚动对齐 x 不起作用。我尝试了一切让我的代码滚动 snap x 但它不起作用。你们中的任何人都可以修复我的顺风代码并使其滚动 snap x 吗?这是我的代码:
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600&display=swap');
* {
font-family: 'Barlow Condensed', sans-serif;
}Run Code Online (Sandbox Code Playgroud)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://cdn.tailwindcss.com"></script>
<title>Project Impossible</title>
</head>
<body>
<div class="snap-y snap-mandatory h-screen w-screen mx:auto overflow-scroll">
<div class="snap-start bg-amber-200 grid w-screen h-screen place-items-center text-8xl">1</div>
<div class="snap-start bg-blue-200 grid w-screen h-screen place-items-center text-8xl">2</div>
<div class="snap-start bg-orange-200 grid w-screen h-screen place-items-center text-8xl">3</div>
<div class="snap-start bg-green-200 grid w-screen …Run Code Online (Sandbox Code Playgroud)