SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Hybrid View

  1. #1
    SitePoint Member
    Join Date
    Sep 2007
    Posts
    14
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Adding space between list items

    I haven't found this addressed in the 2 Rachel Andrew books or in the CSS FAQ:
    When creating a list (ol or ul) I want to put some white space between list items, but not between lines on a single list item. Is there a way to do this with CSS? If I use line-height, it increases the space between all the lines, not just the lines between list items.
    Thanks,
    centaurea

  2. #2
    SitePoint Addict Trent Reimer's Avatar
    Join Date
    Sep 2005
    Location
    Canada
    Posts
    228
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You can adjust the margin property.

    Code:
    /* Margins for the list itself */
    ol, ul {
        margin: 10px 0;
    }
    
    /* Margins for individual list items */
    ol.li, ul.li {
        margin: 5px 0;
    }

  3. #3
    SitePoint Member
    Join Date
    Sep 2007
    Posts
    14
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Trent,
    Tinkering a little with your advice, I ended up using the following for the list items:

    Code CSS:
     /* Margins for individual list items */
    ul.bullet li {
        margin-bottom: 5px;
        }

    And it worked! Thanks so much for pointing me in the right direction!
    --centaurea


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
  •