Home/ Questions/Q 7445405
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-29T11:48:45+00:00

I want to increase the line separator height between li tags. I have tried

  • 0

I want to increase the line separator height between li tags.

I have tried using height:100% but it is not working.

Am I following the right approach. Can anyone help?

CODE:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style type="text/css">
li {
    display:inline;
    list-style-type:none;
    padding-left:1em;
    margin-left:1em;
    border-left:1px solid #ccc;
}
li:first-child {
    border-left:none
}
</style>
</head>
<body>
<table  cellspacing="0px;" style="border-top-width:0.1px; 
     border-top-style:solid;border-top-color:#ccc; border-bottom-color:#ccc; 
     border-bottom-style:solid; border-bottom-width:0.1px;">
  <tr>
    <td><ul>
        <li><a href="#">Item one</a></li>
        <li><a href="#">Item two</a></li>
        <li><a href="#">Item three</a></li>
        <li><a href="#">Item four</a></li>
      </ul></td>
  </tr>
</table>
</body>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The problem is that you have set the li elements to display:inline;. inline elements can’t take height. Instead, use either display:inline-block; or float:left; and display:block;

    li {
    ...
    display:block;
    float:left;
    height:50px;
    ...
}
    • 0