467,074 Members | 977 Online
Bytes | Developer Community
Ask Question

Home New Posts Topics Members FAQ

Post your question to a community of 467,074 developers. It's quick & easy.

Show bullets in inline lists

Hi,
is it possible to show the bullets in a list (ul), although it is
possitioned as an inline element?

Greetings,
Johannes
Jul 20 '05 #1
  • viewed: 6452
Share:
1 Reply
Johannes Theile <ne**************@theile.org> wrote:
is it possible to show the bullets in a list (ul), although it is
possitioned as an inline element?


In CSS only elements that are display: list-item (the default for
<li>) have automatic bullets. As soon as you change that to display:
inline; the bullets vanish. The same applies if you make the <li>s
block elements, either via display: block; or via float.

The following will not work in Internet Explorer, but will work in
Opera and Mozilla:
li:before {content: "\25A0\20";}

(In theory using display: marker; and marker-offset: removes the need
for the space \20 in the above, but support is lacking.)

For IE you'll need to include the bullet in the actual content of the
<li>, which leads to double bullets when CSS is disabled, or use a
background image:

li {padding-left: 15px; background: url(bullet.gif) no-repeat;}

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <st***@pugh.net> <http://steve.pugh.net/>
Jul 20 '05 #2

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

1 post views Thread by Desigan Chinniah | last post: by
6 posts views Thread by Stephen Miller | last post: by
20 posts views Thread by WindAndWaves | last post: by
3 posts views Thread by dingbat@codesmiths.com | last post: by
6 posts views Thread by Laurent Deniau | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.