Join James Williamson for an in-depth discussion in this video Structuring submenus, part of CSS: Styling Navigation.
Before we can start styling our submenus, we first have to create them.…Submenus are lists of links that are nested inside their parent menus.…In order to properly style your submenus, it is critical that they are structured correctly.…And let's take a look at how to do that.…So I have the dropdown.htm file open from the 05_02 directory--I'll scroll down in the…code a little bit so I could focus on our existing menu.…We are going to have three submenus as a part of this: products, blog, and contact are all…going to have submenu options.…
Structuring this is actually really simple, it's just a nested list but you've got to…make sure that you are placing them in the right place.…In the case of products, for example, what I'm going to do is I am just going to create…a little bit of space inside the list item, and this is what's really important about this.…You want your submenus to come after your link but still be inside the list item, you…don't want to stay outside of it, and it's just another unordered list in this case.…
- Organizing menus with lists
- Creating block-level links
- Styling links, link states, and image links
- Defining link dimensions
- Controlling link spacing in a menu
- Creating rollovers
- Clearing floats
- Indicating current pages
- Controlling cursor states
- Building dropdown menus
- Creating CSS-only buttons
Skill Level Beginner
1. Structuring Navigation
2. Link Styling Basics
3. Creating a Vertical Menu
4. Creating Horizontal Menus
5. Dropdown Menus
6. Enhancing Navigation with CSS
Additional resources6m 29s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.