javascript - jQuery slideDown() moves everything below downwards. How to prevent this? -

i have small problem jquery slidedown() animation. when slidedown() triggered, moves stuff below downwards too.

how make stuff below <p> being slid down, remain stationary ?

note:

i prefer solution change done <p> element, or slidedown call or something. because in actual page, there lot of stuff below <p> being slid down, changing/re-arranging of them take longer me ~

demo @ jsfiddle: http://jsfiddle.net/ahmadka/a2mmp/24/

html code:

<section class="subscribe">     <button id="submitbtn" type="submit">subscribe</button>     <p></p> </section> <div style="padding-top: 30px;">     <table border="1">         <tr>             <td>this table moves</td>             <td>down when</td>         </tr>         <tr>             <td>slidedown()</td>             <td>is activated !</td>         </tr>     </table> </div> 

javascript:

$(function () {     $("#submitbtn").click(function (event) {         $(".subscribe p").html("thanks interest!").slidedown();     }); }); 

css:

.subscribe p {     display: none; } 

all need give fixed height of .subscribe.

.subscribe {     height: 50px; }  .subscribe p {     margin: 0px;     display: none; } 

here jsfiddle : http://jsfiddle.net/xl3r8/