SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Oct 2006
    Posts
    14
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Is it possible to set a new of <ul> under <url>?

    I am trying to have two sets of <ul>s going like this under one div. Is this possible?

    <div id="menu">
    <ul>
    <li><span>><a href="#">Home</a></span></li>
    <li><span>><a href="#">About Us</a></span></li>
    <ul>
    <li><span><a href="#">[Address]</a></span></li>
    <li><span><a href="#">[Email]</a></span></li>
    <li><span><a href="#">[Phone]</a></span></li>
    <li><span><a href="#">[Live Chat]</a></span></li>
    </ul>
    <li><span>><a href="#">Products</a></span></li>
    <li><span>><a href="#">Reviews</a></span></li>
    </ul>


    If so, how can I set the css to modify the second <ul> set? I want it to be different color, font size.

  2. #2
    SitePoint Wizard
    Join Date
    Mar 2008
    Location
    United Kingdom
    Posts
    1,285
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You're best bet is to make two classes.

    So first class could be

    .ul1 {
    font-size:16px;
    background:#000
    }

    and then use <ul class="ul1"> or something more descriptive.

    Do you mean nested unordered lists?

  3. #3
    SitePoint Member
    Join Date
    Oct 2006
    Posts
    14
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    it worked. thank you

  4. #4
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,789
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Your HTML is invalid. The only tag allowed directly inside a <ul> is a <li>. The nested <ul> needs to be inside of a <li> tag in order for the HTML to be valid.

    You don't need classes to distinguish the CSS for them either as they can be referenced using

    ul {...}
    ul ul {...}

    to reference the outer and inner ULs respectively.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  5. #5
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    As Stephen said, you need to fix your invalid markup first:
    Code HTML4Strict:
    <div id="menu">
      <ul>
        <li><span><a href="#">Home</a></span></li>
        <li><span><a href="#">About Us</a></span>
          <ul>
            <li><span><a href="#">[Address]</a></span></li>
            <li><span><a href="#">[email]</a></span></li>
            <li><span><a href="#">[Phone]</a></span></li>
            <li><span><a href="#">[Live Chat]</a></span></li>
          </ul></li>
        <li><span><a href="#">Products</a></span></li>
        <li><span><a href="#">Reviews</a></span></li>
      </ul>
    </div>
    Birnam wood is come to Dunsinane


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
  •