Spacing Changing Between List Items

I am using ul and li tags to create a list of selectable links on my page. Each li tag has a div tag that gets loaded using jquery when the itemlink is clicked. At the same time js function runs to colapse any other previously expanded link.

Initially the links are spaced vertically with one space. When I click a link to expand it thus running the js function to colapse the other links(set div tag css.display:"none") extra space gets put between the links that was not originally there. In other words the links spread out more vertically. It is like the margin gets set to larger value or something.

How can settint the div tag display to none affect the spacing?

There's most likely some unexpected CSS taking hold, or extraneous elements in the DOM. Or both.

Your best tool to inspect the DOM and the applied CSS is something like the WebKit debugger in Chrome and Safari. Firebug is good too, but I find the WebKit debugger easier to use.

Bear Bibeault wrote:There's most likely some unexpected CSS taking hold, or extraneous elements in the DOM. Or both.

Your best tool to inspect the DOM and the applied CSS is something like the WebKit debugger in Chrome and Safari. Firebug is good too, but I find the WebKit debugger easier to use.

Thanks again.

I finally found the issue causing the problem was a width attribute in the li tag css was wider than the div tag could allow. When I reduced the value to less than the div tag width the ul tags did not adjust vertically any more.

I don't know if what I just explains makes any sense but it works.

If I don't communicate with you again, which I doubt, in a few days have a Merry Christmas.

Steve Dyke wrote:have a Merry Christmas.

Thanks!