I have a <DIV> with a <UL> inside. When the page loads, several <LI> elements are dynamically created inside the <UL> using createElement(). The page has no trouble automatically calculating the length of div, and everything fits nicely.
However, I have a function that adds new <LI> elements to the <UL>. And while the DIV resizes appropriately, the distance between the div and the elements below it doesn't seem to adjust. So while the DIV gets longer to accommodate the new list elements, it starts to overlap the things below it.
What it should look like: http://aaronkarp.com/random/notspillingtags.png
What actually happens: See http://aaronkarp.com/random/spillingtags.png
Does anyone have any suggestions?
Here is the CSS for the DIV:
border-right: 1px solid #e0e0e0;
border-bottom: 1px solid #e0e0e0;
border-left: 1px solid #e0e0e0;