SitePoint Sponsor |
|
User Tag List
Results 1 to 14 of 14
Thread: list bullets
-
Apr 25, 2001, 13:16 #1
- Join Date
- Feb 2000
- Location
- xyz
- Posts
- 158
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Someone told me that you can use CSS to change the browser standard bullets for lists into your own image. Is this true? How does it work?
-
Apr 25, 2001, 14:01 #2
- Join Date
- Apr 2001
- Location
- Toronto, Ontario, Canada, Earth
- Posts
- 138
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
yes, you can indeed do that, with the help of style sheets. try this code:
Code:<UL STYLE="list-style-image: url(http://www.yoursite.com/bullet.gif)"> <LI>Bullet 1</LI> <LI>Bullet 2</LI> </UL>
Jason Weinstein
webmaster@MaximumEdge.com
http://www.MaximumEdge.com/
-
Apr 26, 2001, 02:52 #3
- Join Date
- Feb 2000
- Location
- xyz
- Posts
- 158
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Thanks! That was exactly what I was looking for...
-
Apr 26, 2001, 07:54 #4
- Join Date
- Dec 2000
- Location
- So. California
- Posts
- 173
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Sorry about the digression, but along the lines of bullets, lists and styles, how can I get the text of a bullet to stay left-aligned if the text wraps to the next line?
-
Apr 26, 2001, 08:44 #5
- Join Date
- Oct 2000
- Location
- Nashvegas Baby!
- Posts
- 7,845
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
not sure what you mean Cokeman...can you post an example?
Adobe Certified Coldfusion MX 7 Developer
Adobe Certified Advanced Coldfusion MX Developer
My Blog (new) | My Family | My Freelance | My Recipes
-
Apr 26, 2001, 09:18 #6
- Join Date
- Feb 2000
- Location
- xyz
- Posts
- 158
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
I think he wants to have:
Code:* Bla bla bla bla Bla bla bla
Code:* Bla bla bla bla Bla bla bla bla
-
Apr 26, 2001, 09:24 #7
- Join Date
- Apr 2001
- Location
- Toronto, Ontario, Canada, Earth
- Posts
- 138
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
this isn't really considered proper html, but if you omit the <ul> it seems to do the trick:
Code:<li>bullet 1</li> <li>buller 2</li>
Jason Weinstein
webmaster@MaximumEdge.com
http://www.MaximumEdge.com/
-
Apr 26, 2001, 11:26 #8
- Join Date
- Dec 2000
- Location
- So. California
- Posts
- 173
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
*sigh* These are the times I feel like an absolute moron -- The page I was given to work with didn't have the <ul></ul> tags, so I was getting what was in maximar's first example, while I wanted what was in the second example.
To try not feeling so dumb, here's a follow-up question -- When I use the <ul><li></li></ul> lists, is there a way to get the list to not have the indent on the left side (between the margin and the bullets)?
Code:|* ^^ |bullet margin instead of | * ^ ^ | bullet margin
-
Apr 26, 2001, 11:41 #9
- Join Date
- Oct 2000
- Location
- Nashvegas Baby!
- Posts
- 7,845
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
I don't think so...however, you can get that effect using tables. Take a look at this page.
http://www.booksamillion.com/ncom/bo...3638462&help=1
Look at the Frequently Asked Questions section.
"I purchased a Millionaire's Club card in a store. Can I use it to get my discount online?"
it wraps just like you are looking for. It's easy to do too.Adobe Certified Coldfusion MX 7 Developer
Adobe Certified Advanced Coldfusion MX Developer
My Blog (new) | My Family | My Freelance | My Recipes
-
Apr 26, 2001, 11:59 #10
- Join Date
- Dec 2000
- Location
- So. California
- Posts
- 173
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Sometimes things are just so obvious when you think about it
Maybe I just need more coke to wake up or something!
-
Apr 26, 2001, 13:04 #11
- Join Date
- Jan 2001
- Location
- Milton Keynes, UK
- Posts
- 1,011
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
You can change the margin of the list with css, just be careful that you don't chop the bullets out as well by setting the margin too narrow.
Code:<style type="text/css"> ul {margin-left: 20px} </style>
-
Apr 27, 2001, 00:42 #12
- Join Date
- Jul 2000
- Location
- Singapore
- Posts
- 2,103
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Shane's application is correct. Using the Margin attribute.
But warning, Netscape 4 isn't good with negative values for margins, which in this case requires just that.
The result/outcome in Netscape 4 would be the first few characters of the first word overlapping the bullet.
My suggestion would be not to use Bullets if you want that result.
I have a nifty workaround, which is to use:
'·' as the bullet item.
If you view my web site, I use that everywhere."Imagination is more important than knowledge. Knowledge is limited. Imagination encircles the world."
-- Albert Einstein
-
Apr 30, 2001, 12:23 #13
- Join Date
- May 2000
- Location
- Ft. Worth, TX, USA
- Posts
- 55
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally posted by cokeman
To try not feeling so dumb, here's a follow-up question -- When I use the <ul><li></li></ul> lists, is there a way to get the list to not have the indent on the left side (between the margin and the bullets)?
Code:|* ^^ |bullet margin instead of | * ^ ^ | bullet margin
Instead of using the usual <ul><li></li></ul>, you can simply putCode:<pre>&149;</pre>
Last edited by Pat Burroughs; Apr 30, 2001 at 12:38.
-
Apr 30, 2001, 12:45 #14
- Join Date
- Feb 2000
- Location
- xyz
- Posts
- 158
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
That doesn't work on Macs. I recommend using a small gif image and setting the vspace and hspace to something like 5
Bookmarks