aspose file tools*
The moose likes HTML, CSS and JavaScript and the fly likes Spacing Changing Between List Items Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login


Win a copy of Spring in Action this week in the Spring forum!
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "Spacing Changing Between List Items" Watch "Spacing Changing Between List Items" New topic
Author

Spacing Changing Between List Items

Steve Dyke
Ranch Hand

Joined: Nov 16, 2004
Posts: 1466
    
    1
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?
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61413
    
  67

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.


[Asking smart questions] [Bear's FrontMan] [About Bear] [Books by Bear]
Steve Dyke
Ranch Hand

Joined: Nov 16, 2004
Posts: 1466
    
    1
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.
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61413
    
  67

Steve Dyke wrote:have a Merry Christmas.


Thanks!

 
I agree. Here's the link: http://aspose.com/file-tools
 
subject: Spacing Changing Between List Items