TailwindCSSでHeaderを固定する

ツイート
2021年07月11日
2021年07月12日

className="sticky top-0 z-50"で固定する。

js
import Header from '@/components/organisms/header.js' export default function Layout({ children }) { return ( <> {/* ヘッダーを固定する */} <div className="sticky top-0 z-50"> <Header /> </div> {/* メインコンテンツ */} <div>{children}</div> </> ) }