I am attempting to use jQuery for the following purpose:
1. I have page that contains a div element which will contain my generated HTML code. The width of this div element is arbitrary.
2. In that div element, I would like to fit several other div elements which have their "display" property set to "inline-block"
3. The div elements from step 2 are returned by an AJAX call from the server after the page was loaded.
4. Once the returned HTML is placed inside the top level div (using $().html ()), I set the "display" property to "none" and then call the ".slideDown" method on the containing div to have the appearance of the newly loaded content be presented to the user.

The problem that I am see is that the sliding effect works well on the first row of child divs but then ends up jumping when it reaches the second. I have the feeling that this is due to the fact that because I generate all the child div's in one continuous line and let the browser split them into multiple "lines" depending on how many can fit inside the containing div (because I don't know it's width).

I am looking for advice on how to do this better? Any help is appreciated.
Thank you