W3.CSSLesson 37Free preview
W3.CSS Sidebar
This lesson is part of W3.CSS · All levels
Summary
A sidebar is a panel on the side of a page that usually stores navigation, filters, or concise information. It provides a class w3-sidebar that can be combined with a w3-bar-block so that the links are arranged vertically, complete with an overlay to cover the main content when the menu is open. The sidebar is very helpful for a site with many sections. (W3.CSS)
Key points
- The w3-sidebar keeps the panel on the left or right side of the page
- W3-bar-block arranges the links in the sidebar vertically
- W3-overlay covers the main content so that the focus moves to the menu
- The sidebar can be hidden and displayed via short JavaScript
- On a narrow screen, the sidebar is often used as a menu that closes half the screen
Full lesson
Code examples and quizzes
Full lessons, code examples, and quizzes are available to subscribers. 5 questions.