jQuery SlideUp y position relative...

Buenas,

Estoy intentando hacer un slideUp a un div, mi problema es que cuando hago el slideUp de dicho div, quiero que el siguiente div en html, tome las propiedades de relative con respecto al div anterior escondido. Como probablemente me esté explicando bastante mal os pongo un ejemplo con screens para que le echeis un vistazo.

Aqui el menu segun abro la página.

Aqui con el efecto SlideUp realizado.

Como veis, el recuadro rojo es el div siguiente, y mi intención, es que suba para arriba.

Le tengo puesto un position relative para que sube cuando desaparece el div del slideUp, pero nada, no hay manera.

He revisado la documentación de jQuery y al hacer ese slide, pone la propiedad display:none por lo que el position:relative del siguiente div deberia funcionar si no me equivoco.

Codigo css del div que desaparece:

div#content1 div#menu { display:block;width:1024px;height:32px; }

Codigo css del div que deberia subir:

div#content { 
	position:relative;
	margin:0px auto;
	height:1024px;
	width:1024px;
	background-color:white;
	-webkit-box-shadow: 0px 10px 12px rgba(32, 56, 96, 0.45);
	-moz-box-shadow:    0px 10px 12px rgba(32, 56, 96, 0.45);
	box-shadow:         0px 10px 12px rgba(32, 56, 96, 0.45);
}

Parte de código html:

<div id="header1">
    <div id="logo">

</div>
</div>
<div id="content1">
	<div id="menu">
    	<ul>
        	<li class="menu1"><a href="#" class="menu1">RESUMEN</a></li>
            <li class="menu1"><a href="#" class="menu1">NOTICIAS</a>
            	<ul>
                    <li><a href="#">ITEM 1</a></li>
                    <li><a href="#">ITEM 1</a></li>
                    <li><a href="#">ITEM 1</a></li>
                </ul>
            </li>
            <li class="menu1"><a href="#" class="menu1">PARTIDOS</a></li>
            <li class="menu1"><a href="#" class="menu1">TORNEOS</a>
           		<ul>
                    <li><a href="#">CREAR TORNEO</a></li>
                    <li><a href="#">ELIMINAR TORNEO</a></li>
                    <li><a href="#">EDITAR TORNEO</a></li>
                </ul>
            

        </li>
        <li class="menu1"><a href="#" class="menu1">USUARIOS</a></li>
    </ul>
</div>
<div id="panel">
	PEDRITO
</div>
</div>
<div id="content">

Código jQuery

var x=$(document).ready;

x(despliegue)

function despliegue()
{
	$("#panel").click(function()
	{
		if($("#menu").css('display') == "block")
		{
			$("#menu").slideUp('1000');
			$("#panel").text('Mostrar panel');
		}
		else if
		($("#menu").css('display') == "none")
		{
			$("#menu").slideDown();
			$("#panel").text('Ocultar panel');
		}
	})
}