PDA

View Full Version : Animated Collapsible DIV problem with nested div's



daanvh
06-29-2010, 09:44 PM
1) Script Title: Animated Collapsible DIV

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm

3) Describe problem:
The divs that need to slide up and down consist out of a parent div and multiple div's nested in them. However, when the css 'float' attribute is used on one of the nested divs, the parent div which needs to slide will not slide back up.

Do you have any idea how to fix this? I can't find another script that does all the same tricks which are required!

Example of the code of one of the collapsible div's (one with the error):


<div id="awareness">this is the collapsible div
<div id="awareness-left">
<div id="awareness-left-content">this has content of left box</div>
</div>
<div id="awareness-right">this is a right box</div>
</div>

This is the CSS:

#awareness {
margin-left:40px;
width:742px;

}

#awareness-left {
float:left;
width:475px}

#awareness-left-content {
background-color:#eff4fa;
padding-top:10px;
padding-left:5px;
padding-right:5px;
}
#awareness-right {
float:left;
height:515px;
width:245px;
background-color:#eff4fa;

}

An example can be found here:

http://laatzoeken.nl/DvW/

Multiple div's seem to work, only when float is used, things go bad. Please help me out!

daanvh
06-30-2010, 08:52 AM
Already got it fixed.

The problem was a thing with the padding property.

bye.