SitePoint Sponsor

User Tag List

Results 1 to 11 of 11

Thread: Bullets

  1. #1
    SitePoint Enthusiast
    Join Date
    Apr 2009
    Location
    Mobile, AL
    Posts
    49
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Bullets

    My bullets are not showing up. I'm using the proper format:

    <ul>
    <li>XXXXXXXXXX</li>
    <li>XXXXXXXXXX</li>
    <li>XXXXXXXXXX</li>
    <li>XXXXXXXXXX</li>
    </ul>

    What could be the problem??

  2. #2
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,656
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    Any css?

  3. #3
    SitePoint Wizard bronze trophy Black Max's Avatar
    Join Date
    Apr 2007
    Posts
    4,029
    Mentioned
    12 Post(s)
    Tagged
    0 Thread(s)
    Eric's right, this is most likely a CSS issue. If you've styled your lists with this code:

    Code CSS:
    li {
    list-style type: none;
    }

    you won't have any bullets.

    EchoEcho has a good basic tutorial on styling lists. It's a bit old in referring to browsers like NS4 ( ) but the info's still valid.

  4. #4
    SitePoint Guru Luki_be's Avatar
    Join Date
    Jun 2008
    Location
    Brazil, Minas Gerais. But i'm from Belgium.
    Posts
    867
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It's indeed hard to tell without any css. If the OP didn't use list-style type: none on the li, it could be that the problem is the default 16px left margin (or padding) on ul’s. Besides, the OP didn't mention if it's only in IE or cross browser.

    The default space for the bullet in lists is usually about a 16px left margin, added by default to the UL to allow the bullet image to show.

    Ideally, the margin should have been reset to zero, either initially with the global reset, or using:

    Code CSS:
    ul {
         margin:0;padding:1em;
    }

    This will make the bullets show up in all browsers, but you need to check that the 1em still gives enough room for the bullet to show. Usually a 16px left margin or padding does the trick.
    SitePoint Guru
    Sitepoint - the ultimate Css well
    As a computer, I find your faith in technology amusing.
    Sitepoint reference, your friend in need

  5. #5
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Also in IE if you float the <li>'s then that will remove the bullets because it makes the <li>'s block level and it's a bug that it isn't showing the bullets.

    I think that about covers all hte reason(s) browser(s) won't show the bullets lol
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  6. #6
    SitePoint Guru Luki_be's Avatar
    Join Date
    Jun 2008
    Location
    Brazil, Minas Gerais. But i'm from Belgium.
    Posts
    867
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    And thus ends the guessing game (for now)
    SitePoint Guru
    Sitepoint - the ultimate Css well
    As a computer, I find your faith in technology amusing.
    Sitepoint reference, your friend in need

  7. #7
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    It always is with no code lol
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  8. #8
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,656
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    Also if the ul is position absolute or fixed that would remove bullets

  9. #9
    SitePoint Enthusiast
    Join Date
    Apr 2009
    Location
    Mobile, AL
    Posts
    49
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    My bad. No CSS. Is there any other way to insert bullets correctly? I'm still pretty much a Newbie, so bear with me guys (and/or gals).

  10. #10
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,656
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    that makes bullets man so your doing something with the css to say no bullets.

    see for yourself. http://www.visibilityinherit.com/projects/bullets.html

  11. #11
    om nom nom nom Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,272
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    Aha, but!

    What browser are you looking in, dapperdad? because if your list is hugging the left side of (the page, or a container with overflow: hidden or whatever), you might not see bullets because they'll be offscreen. At least, I remember this happening to me at least once.

    Eric's example still had default padding/margins on the body/html elements, but if there's a CSS reset removing those, then you won't see bullets even though there's no CSS on the list itself.

    More HTML? Which browser? If you add a huge left margin to the list, do you suddenly see the bullets? : )


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
  •