SitePoint Sponsor

User Tag List

Results 1 to 4 of 4

Thread: multiple nav?

  1. #1
    SitePoint Wizard lukeurtnowski's Avatar
    Join Date
    Mar 2003
    Location
    Coronado
    Posts
    1,656
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)

    multiple nav?

    ifI want to have 3 menus, how do Ie the <nav>element to do so?
    I want to have a menu in the header, sidebar, and footer.

    Thanks...
    "Oh, and Jenkins--apparently your mother died this morning."

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,293
    Mentioned
    460 Post(s)
    Tagged
    8 Thread(s)
    You can have as many as you like. If you want to style them differently, you could give them separate classes, though that's likely not to be necessary, as you could target them separately in various ways, such as:

    Code:
    header nav {}
    aside nav {}
    footer nav {}
    or of course

    Code:
    .header nav {}
    .sidebar nav {}
    .footer nav {}

  3. #3
    SitePoint Wizard lukeurtnowski's Avatar
    Join Date
    Mar 2003
    Location
    Coronado
    Posts
    1,656
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    ok, then what is the purpose of the role="" thing when /I can target them like
    header nav {}
    "Oh, and Jenkins--apparently your mother died this morning."

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,293
    Mentioned
    460 Post(s)
    Tagged
    8 Thread(s)
    The role attributes (known as ARIA roles) are an accessibility feature (some of which won't be needed when HTML5 is more widely supported). They are handy for now, as a screen reader won't know that a <nav> is for navigation, so you can help them along with

    <nav role="navigation">

    The role attribute can also be used as a hook for styling, as you say, but it's not really needed for that, as you can usually target elements by referencing their unique parents.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •