WEB Need help with a nested list

Discussion in 'OT Technology' started by M3Driver, Apr 21, 2009.

  1. M3Driver

    M3Driver New Member

    Joined:
    Oct 28, 2003
    Messages:
    5,622
    Likes Received:
    0
    Location:
    Minneapolis
    I am having trouble getting the numbers to display in the nested list, they are coming up as red bullets in all my browsers, even though W3 schools says it is correct link and it displays properly in Dreamweaver.

    Anybody have any ideas?

    html:
    Code:
      <l><span class="text">The List:</span><ul class="redbullet">
      <li>Problem 1</li>
      <li>Problem 2</li>
      <li>Problem 3</li>
        <ol class="numbullet">
          <li>Problem 3 Indicator 1</li>
          <li>Problem 3 Indicator 2</li>
          <li>Problem 3 Indicator 3</li>
        </ol></ul></l>
    
    And the CSS:
    Code:
    .text{
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: 12px;
        line-height: 1.25;}
    
    .l{
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: 12px;
        margin-top:0;
        margin-bottom:0;}
    
    .redbullet{
        list-style-image: url(img/redbullet.gif);
        margin-top:0;
        margin-bottom:0;
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: 12px;
        line-height: 1.25;}
    
    .numbullet{
        list-style-type: decimal;
        margin-top:0;
        margin-bottom:0;
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: 12px;
        line-height: 1.25;}
    
    
     
  2. White Stormy

    White Stormy Take that, subspace!

    Joined:
    Sep 17, 2002
    Messages:
    85,486
    Likes Received:
    69
    Location:
    Sparkopolis
    what is l supposed to be?
     
  3. M3Driver

    M3Driver New Member

    Joined:
    Oct 28, 2003
    Messages:
    5,622
    Likes Received:
    0
    Location:
    Minneapolis
    It removes the margins so the numbered list is on the line directly under the bullets.

    It should have also taken care of the class="text" for the heading but for some reason the font doesn't work.
     
  4. seadub

    seadub New Member

    Joined:
    Nov 20, 2008
    Messages:
    11
    Likes Received:
    0
    Try setting "list-style-image:none;" in your numbullet class. There might be some weirdness with the list-style-image from the parent list.
     
  5. M3Driver

    M3Driver New Member

    Joined:
    Oct 28, 2003
    Messages:
    5,622
    Likes Received:
    0
    Location:
    Minneapolis
    Tried it, doesn't work.

    I do have it working in FF and Safari, but IE7 (and I'm sure IE6- as well) don't show it.

    How frikkin hard is it to have a browser display valid html??
     

Share This Page