space between list items

this should be easy but is quite urgent

when you create a list (ul, ol etc, etc) how do you put a space netween the lines - i have tried using <br> but then my code fails html validation

for example

<ul>
<li>line one</li>
<li>line two</li>
<li>line three</li>
</ul>

how do i force a space between the lines whilst keeping my code vaild? - i need a solution that will work in IE, Netscape and Firefox.

thanks
naifyboy123Asked:
Who is Participating?
 
BatalfConnect With a Mentor Commented:
You can also use margin-bottom if you have list items that uses several lines, and you only want the space after the end of the item.

example:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<head>
    <title>Test</title>
    <style type="text/css">
    li{
        margin-bottom:10px;
    }
    </style>
</head>
<body>

<ul>
<li>line one</li>
<li>line two</li>
<li>line three</li>
</ul>

</body>
</html>
0
 
DBBConnect With a Mentor Commented:
Hi,

Use CSS for the spacing.

ie: -

.list
{
line-height: 200%;
margin-left: 10px;
font-style: normal;
}


Dbb
0
 
naifyboy123Author Commented:
ooops i forgot to mention that sone of my list lines run accross 2 lines of the page and that fix means i get a space on all lines:

<ul>
<li>this line is long and actually spans 2 lines on the page before the next list item is shown and therefore the second line of the list shows a space which i dont want</li>
<li>this line is normal and only spane one line of the page</li>
<li>this line is alo slong blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah</li>
<li>and this line only spans one line as well</li></ul>

sorry - is there a way i can only make the list "items" have the space between them rather than a space on every line regardless?


0
Upgrade your Question Security!

Your question, your audience. Choose who sees your identity—and your question—with question security.

 
BatalfCommented:
yes, by using margin-bottom

example:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<head>
      <title>Test</title>
      <style type="text/css">
      li{
            margin-bottom:10px;
      }
      </style>
</head>
<body>

<ul>
<li>this line is long and actually spans 2 lines on the page before the next list item is shown and therefore the second line of the list shows a space which i dont want</li>
<li>this line is normal and only spane one line of the page</li>
<li>this line is alo slong blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah</li>
<li>and this line only spans one line as well</li></ul>

</body>
</html>
0
 
naifyboy123Author Commented:
sorry shoud have refreshed before posting - thank batalf
0
 
BatalfCommented:
Glad I could help!

Batalf
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.