HTML CSS

STICKY MENU WITH HTML CSS

(a quick guide & example)

JUST SANDWICH <A> INTO <NAV> <nav id="menu">   <a href="#">ONE</a>   <a href="#">TWO</a>   <a href="#">THREE</a> </nav>

NAV MENU HTML

01

<main>CONTENT</main>

#menu {   STICK TO TOP ON SCROLL   position: sticky; top: 0; left: 0;     FLEX LAYOUT, BACKGROUND COLOR   display: flex; background: #2c2c2c; }

NAV MENU CSS

02

MENU ITEMS #menu a {   color: #fff; text-decoration: none;   padding: 10px; } #menu a:hover { background: #691717; }