Grokking CSS Design Patterns to Ace Interviews/

...

/

Problem: Slide-In Sidebar Panel

Problem: Slide-In Sidebar Panel

Try to create a sidebar panel that slides in smoothly from the left on page load using CSS animations.

We'll cover the following...

Problem description

Given an HTML page containing a <div class="sidebar-panel"> element, write CSS to:

  • Position the panel off-screen with transform: translateX(-100%).

  • Define a @keyframes slideIn ...