Bullets

HTML & CSS
1

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

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

3

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).

4

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? : )

5

Any css?

6

Eric’s right, this is most likely a CSS issue. If you’ve styled your lists with this code:

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 ( :fire: ) but the info’s still valid.

7

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:


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.

8

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 :slight_smile:

9

And thus ends the guessing game (for now) :smiley:

10

It always is with no code lol :slight_smile:

11

Also if the ul is position absolute or fixed that would remove bullets