www.webdeveloper.com
Results 1 to 4 of 4

Thread: List floated: spacing issues

  1. #1
    Join Date
    Feb 2005
    Posts
    200

    List floated: spacing issues

    The two lists under "Menu A" and "Menu B" display a small gap between them (using FF 1.5 on Mac OS), and it doesn't seem normal since all paddings and margins are set to 0.
    Notably, in some styled lists there are no gaps between submenus at all, and it's been quite hard to identify why there's this difference.

    Code:
    <style>
    ul {list-style: none; margin: 0; padding: 0; background: blue;}
    li {float: left; border:
               margin-right: 1em;
               position: relative; 
               background: none;
               padding: 3px 0; margin: 0;
    	   text-align: center;
               background: yellow;
               width: 15%;
               font: 12px helvetica;
              }
    ul ul li {width: auto; float: none;}
    </style>
    
    <body>
    
    <ul>
        <li><a href="">Link 1</a></li>
        <li><a href="">Link 2</a></li>
        <li><a href="">Menu A</a>
    	   <ul>
    		 <li><a href="">item 1</a></li>
    		 <li><a href="">item 2</a></li>
    		 <li><a href="">item 3</a></li>
    		 <li><a href="">item 4</a></li>
    		 <li><a href="">item 5</a></li>
           </ul></li>
        <li><a href="">Menu B</a> 
           <ul>
            <li><a href="">item 1</a></li>
            <li><a href="">item 2</a></li>
            <li><a href="">item 3</a></li>
            <li><a href="">item 4</a></li>
            <li><a href="">item 5</a></li>
          </ul></li>
        <li><a href="">Link 5</a></li>
        <li><a href="">Link 6</a></li>
    </ul>
    </body>

    There seem to be a lot of issues relating to css and lists, this is only one of them. Thanks for checking.

  2. #2
    Join Date
    Aug 2004
    Location
    Ankh-Morpork
    Posts
    19,225
    No gap visible to me in IE6 or FF1.5 on WinXP.
    "Please give us a simple answer, so that we don't have to think, because if we think, we might find answers that don't fit the way we want the world to be."
    ~ Terry Pratchett in Nation

    eBookworm.us

  3. #3
    Join Date
    Feb 2005
    Posts
    345
    - no gap in Opera Version 8.02
    - no gap in IE 5.5
    - blue bars on the left of "item 1" in "Menu A" and "Menu B" in IE 5.01

    System: Windows XP
    Last edited by jogol; 04-03-2006 at 06:32 AM.
    free music: comatronic

  4. #4
    Join Date
    Feb 2005
    Posts
    200
    Kudos bros. I'll check it through to see what else might be causing the problem.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles