Es que ese no es problema de CSS tío es simplemente cosa de javascript. Veamos tienes dos caminos, uno usar ajax (Qué sería lo óptimo) y otro, esconder los divs y llamarlos cuando sean necesarios.
Veamos bajo el primer método tendría que haber una conversación algo más larga, sobre el segundo en cambio la cosa se acorta mucho.
Pongamos que tienes tus dos barras tipo frame que se llamen, cabecera e izquierda, y tengas un central. A ese div central es al que deberemos dar los estilos para que se posicione, y las secciones que según dices son 4 serían cuatro divs internos, que tendrían un ancho y un alto de 100% para que ocupen todo el div, y todos ellos con display:none; (Bueno menos el que sea el principal.) Luego hacemos una manipulación de propiedades de CSS con javascript de la siguiente manera:
Asumiremos que tus divs se llaman "uno","dos", "tres" y "cuatro". Asumiremos que el div "uno" no tiene el display none. y empezaremos enseñando el div "dos"
Código:
<script type="text/javascript">
objeto = 'uno';
function enseñar(enseñame){
document.getElementById(objeto).style.display="none";
document.getElementById(enseñame).style.display="block";
objeto=enseñame;
}
</script>
Y la llamada sería:
<li onclick="enseñar('uno');">ver uno</li>
<li onclick="enseñar('dos');">ver dos</li>
<li onclick="enseñar('tres');">ver tres</li>
<li onclick="enseñar('cuatro');">ver cuatro</li>
Cualquier pregunta me la haces por MP, claro, la salida abrupta del div no va a ser lo más bonito del mundo, pero en mi blog he hecho un tutorial para que juegues con fade de una manera sencillona.
http://remsr.com/articulos/fade_noob.php
Saludos, y cualquier pregunta por MP o me la pones en un comentario ahí.