SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Zealot
    Join Date
    Jun 2003
    Location
    Springfield, Missouri
    Posts
    142
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Problem with list-style

    I have a custom bullet that I use for all normal bulleted lists within my content. But I have a left navigation panel that I want to display without bullets. It isn't working in any browser that I know of except IE 6 and only sprodically in IE 6. You can hit the test page and the bullets are not in the nav panel but when you refresh a time or two they show up. My CSS validated so I don't know why it's not working.

    Here is the test page. http://muttcats.com/style_examples.htm

    Here is the relevant CSS:

    Code:
    ul   { list-style-image: url('http://muttcats.com/graphics/smbullet.gif');  text-align: left; }
    
    #menu  { color: #000000; background-color: transparent;
    	 margin-top: 4px;
    	 padding: 0px;	}
    					
    #menu ul	 { list-style-type: none;
    	  margin: 0; 	}		
    	
    #menu li 	{ list-style-type: none;
    	padding: 0px;
    	margin-top: 0px;
    	margin-bottom: 7px;
    	text-align: center;	}
    
    #menu li a { display: block;
    	color: #213973; background-color: #C3CDE6;
    	width: 160px;
    	font-weight: bold;
    	margin: 0px;
    	padding: 3px;
    	border: 2px outset;
    	text-decoration: none;	}
    I'm sure this CSS is messy as it's only our second effort with using CSS, but I don't understand why the menu id is not working to suppress the bullet.

    I will try to attach the entire CSS as a test file in case it's something that has nothing to do with the menu id.
    Attached Files Attached Files

  2. #2
    SitePoint Zealot
    Join Date
    Jun 2003
    Location
    Springfield, Missouri
    Posts
    142
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Figured it out finally.

    Seems you have to specify list-style-image: none as well as list-style-type: none.

  3. #3
    ********* Streaker Lister14's Avatar
    Join Date
    Jun 2002
    Location
    C:\Documents and Settings\Desktop\Recycle Bin
    Posts
    677
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by aroach
    Figured it out finally.

    Seems you have to specify list-style-image: none as well as list-style-type: none.
    good, this worked for me too, and was about to suggest the same. Indeed i have changed the list-style-image to a very samll white.gif, to over-ride the type.
    roy.lu
    C:\DOS... C:\DOS\RUN... RUN\DOS\RUN...!

  4. #4
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Or you can use the shorthand "list-style" property, which will cover both list-style-type and list-style image .

  5. #5
    SitePoint Zealot
    Join Date
    Jun 2003
    Location
    Springfield, Missouri
    Posts
    142
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by vgarcia
    Or you can use the shorthand "list-style" property, which will cover both list-style-type and list-style image .
    Will do. I'm very new to CSS and know that I'll need some help optimizing this style sheet. There are probably a bunch of lines in it that aren't even doing anything.

  6. #6
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Well if you need help, let us know!


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
  •