I am fairly new to jQuery and I'm trying to implement a slideDown / slideUp effect which shows a div containing a contact form when a button / link is clicked by a user. The button is an `<li>` within an unordered list. 

It is working fine in all browsers on my Mac and also works in IE8 and IE9, however in IE7 the content displays (after animating poorly, not uncovering gracefully) but the contact form appears behind the content below it rather than pushing that content further down. Also when the form is shown, clicking the input areas to input text simply retracts the div (via slideUp).

I have read a number of posts on this and other sites about adding zoom:1; and playing with position:relative; etc. but nothing has worked to this point. Any help would be greatly appreciated! 

Thanks in advance :)

I will include some code below to give you an idea:

The jQuery:

```
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {

    $('#send_message li').click(function () {

        var text = $('.form');

        if (text.is(':hidden')) {
            text.slideDown('200');
            $(this).children('span').html('-');    
        } else {
            text.slideUp('200');
            $(this).children('span').html('+');    
        }

    });

});
</script>

```

The HTML:

```
<div id="message_form">
<ul id="send_message">
<li>
<span>+</span><h2>Send Us A Message</h2>
</li>
<div class="form"><!--Form goes here--></div>
</ul>
</div>

```

The CSS:

```
#message_form {
        display:block;
        clear:both;
        margin-top:0px;
        position:relative;
        width:940px;
        }

#send_message {
        color:#65b939;
        list-style-type:none;
        margin:0;
        padding:0;
        width:940px;
            }

#send_message li {
        background-color:#e9e9e9;
        cursor:pointer;
        height:45px;
        position:relative;    
        width:940px;           
    }

    #send_message span {
        font-size:18px;
        margin-left:12px;
        position:absolute;
        top:15px;
    }

    #send_message h2 {
        font-size:18px;
        margin-left:32px;
        position:absolute;
        top:15px;
    }

    #send_message .form {
        background-color:#fff;
        display:none;
        padding-top:10px;
        position:relative;
                }   

```