#1
  1. Getting better 1 line @ a time
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Feb 2004
    Location
    Sheffield
    Posts
    1,013
    Rep Power
    33

    CSS and line spacing in a <li>


    Hi

    I have a classic CSS:-

    ul.none {
    FONT-SIZE: 70%;
    line-height: 10pt;
    COLOR: #000000;
    list-style-position: intside;
    list-style-type: none;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    position:relative;
    width:150px;
    padding:10px;
    text-align:center;
    BACKGROUND-COLOR: #EDF5F5;
    border: 1px solid #0000000;
    }

    AND THE HTML:-

    <ul class="none">
    <li>NEWS 1</li>
    <li>NEWS 2</li>
    <li>NEWS 3</li>
    <li>NEWS 4</li>
    <li>NEWS 5</li>
    </ul>

    I want to have a larger gap between each <li> item, without using a <p> or a <br>?

    Line height or spacing does not work, it spaces out everything. E.g if the text in the <li> is longer than a line it makes this line higher, which means it looks well daft if you see what i mean. because everything is so spaced out.

    Margin and Padding do not work for what i wish to achieve.

    Could anyone Help please.
  2. #2
  3. No Profile Picture
    The Forest
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2002
    Posts
    321
    Rep Power
    13
    I don't see why this won't work...

    Code:
    ul.none li {
    margin: 5px 0;
    }
    Hope that helps!

    Happy coding!
  4. #3
  5. Getting better 1 line @ a time
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Feb 2004
    Location
    Sheffield
    Posts
    1,013
    Rep Power
    33
    Job Done, thank you.

IMN logo majestic logo spyfu logo threadwatch logo seochat tools logo