From the course: Advanced Responsive Layouts with CSS Flexbox
Unlock the full course today
Join today to access over 22,600 courses taught by industry experts or purchase this course individually.
Marking up five types of menus - CSS Tutorial
From the course: Advanced Responsive Layouts with CSS Flexbox
Marking up five types of menus
- As I explained in the introduction to this course, we're slowly going to build out some different demo pages for flexbox and to make this possible, each movie comes equipped with its own lesson files. To follow along, just grab you favorite code editor, in my case, Brackets, open the lesson files for this chapter and movie and start experimenting. In this chapter, we're going to work on several different menu layouts. To get started, it's important to know how these layouts were put together in the markup. So, go to your code editor, navigate to your Exercise Files, Chapter_02 and then movie 02_02 and open menus.html. When you look at this document, you'll see it's a pretty standard HTML5 document. We'll scroll down past the masthead header to this main area where we have a div of the class "centered" that just centers the content on the page. And within this class "centered" we have a series of sections. And each of the sections contain a menu. Off the top, we have the Single Level…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Contents
-
-
-
-
Exploring common menu layouts1m 28s
-
(Locked)
Marking up five types of menus4m 53s
-
(Locked)
Using Flexbox to control single-level menu layout7m 21s
-
(Locked)
Using Flexbox to control advanced menus6m 51s
-
(Locked)
Using Flexbox to control multilevel menus with dropdowns6m 24s
-
(Locked)
Creating a social media menu3m 17s
-
(Locked)
Using Flexbox to control multiple menus4m 38s
-
-
-
-
-
-