SitePoint Sponsor |
|
User Tag List
Results 1 to 6 of 6
-
Mar 1, 2002, 19:10 #1
- Join Date
- May 2000
- Location
- San Diego, CA
- Posts
- 463
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
CSS - Line-Height Tag Question???
Hi All,
I have looked around and could not find the answer to my question. I am really new at style-sheets, but I am really having fun learning about them and implementing them into my sites.
Here's the question...
I am creating tags for a list that I have created in my left navbar. I would like there to be space between each bullet listed so someone told me to use:
ul{line-height: 16pt;}
This does the trick, but it also puts that space between items that have more than one line. What I want is for there to be space only between each new bullet.
Is there a tag for that?
Thanks,
Doug
-
Mar 1, 2002, 20:31 #2
-
Mar 1, 2002, 22:08 #3
- Join Date
- Oct 2001
- Location
- Beyond yonder
- Posts
- 2,384
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Yeah. Line-height is a typographical property that alters the height of lines of text, not the spacing between elements. If you take a look at the NYPL Style Guide you can see a nice, obvious example of line-height in action.
Like Wayne said, you could increase the padding for the <UL>, but you can also increase it's margin instead in much the same way you'd use to adjust the padding:Code:/* Both of these examples'll set the top and bottom spacing to half of the letter height tall, while the left and right sides are set to nothing */ margin: .5em 0; padding: .5em 0;
-
Mar 2, 2002, 19:17 #4
- Join Date
- May 2000
- Location
- San Diego, CA
- Posts
- 463
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Hi Guys,
I appreciate the help, but I still cannot get the result I want.
When I try: padding-bottom: 5px; (I used 35 to make it obvious) I get spacing after the </ul> when I want spacing between the <li> tags.
I tried the other method as well and did not get the spacing between the <li> tags either.
Could I be doing something wrong?
Thanks again,
Doug
-
Mar 2, 2002, 20:31 #5
- Join Date
- May 2001
- Location
- View Ridge
- Posts
- 692
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Doug,
Try setting the padding-bottom of the <li> instead of the <ol>:
li {padding-bottom:10px;}
Adjusting the padding of the <ol> will effect the space around the entire list, whereas <li> should effect the space around the individual <li>'s.
HTH
-
Mar 2, 2002, 20:43 #6
- Join Date
- May 2000
- Location
- San Diego, CA
- Posts
- 463
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
I thought I tried that, but I guess I did something else. That worked perfectly! Thank-you very much! I think I worded the question wrong the first time I asked, leaving out that I wanted the space between the <li> tags.
I really appreciate everyones help...
Thanks again,
Doug
Bookmarks