Muchas gracias, he hecho lo que me has dicho poner la columna derecha dentro de una capa con anchura fija y ese problema se ha solucionado, también he conseguido que la parte izquierda tenga un fondo blanco fijo pero esto me ha creado otro problema, me desplaza los divs de la parte derecha.
Dejo la última versión de la hoja de estilos y un par de imágenes para que veas l o que digo.
http://i524.photobucket.com/albums/cc328/s7474/4.jpg
http://i524.photobucket.com/albums/cc328/s7474/5.jpg
Código HTML:
@charset "utf-8";
/* CSS Document */
body{
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
font-weight: normal;
margin: 0px;
/*background-color:#f9f8eb;*/
background-color:#FFFFFF;
background-color:#ddead2;
}
.titulo{
text-align:center;
color: #000000;
width:80%;
background-color:#faf8c9;
margin-top: -16px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
background-color:#FFFFFF;
}
.centrar{
text-align:center;
margin-bottom:0px;
}
.menu{
width:80%;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
.menu3{
width:656px;
height:394px;
margin: 0px;
padding:0px;
background-image:url(caratulas/fondo.jpg);
float:left;
width:80%;
}
.menu31{
height:394px;
margin: 0px;
padding:0px;
float:left;
background-color:#FFFFFF;
height:100%;
/*width:656px;*/
width:80%;
height:auto;
}
.menu4{
float:left;
color:#000000;
text-align:center;
font-size:13px;
background-color:#CCCCCC;
font-weight:bold;
background-color:#add18f;
width:20%;
width:100%;
height:auto;
}
.menu5{
float:left;
color::#6dbb2c;
color:#FFFFFF;
text-align:center;
font-size:13px;
background-color:#FFFFFF;
font-weight:bold;
width:20%;
height:auto;
background-color:#000000;
}
div.menu5 a{
text-decoration:none;
font-weight:bold;
color:#FFFFFF;
}
div.menu5 a:hover{
text-decoration:none;
font-weight:bold;
color:#FFFFFF;
}
div.menu5 a:link{
text-decoration:none;
font-weight:bold;
color:#FFFFFF;
}
.fondonegro{
width:80%;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
text-align:center;
background-color: #000000;
}
.fondonegro2{
width:80%;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
text-align:center;
padding-top: 5px;
padding-bottom: 5px;
background-color: #FFFFFF;
font-weight:bold;
font-size:15px;
color:#5fb914;
}
div.fondonegro2 a{
font-size:15px;
color:#000000;
text-decoration:none;
font-weight:bold;
}
div.fondonegro2 a:hover{
color:#000000;
text-decoration:none;
font-weight:bold;
}
div.fondonegro2 a:link{
font-size:15px;
color:#000000;
text-decoration:none;
font-weight:bold;
}
.fondoverde{
width:820px;
height:100%;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
text-align:center;
background-color: #add18f;
width:80%;
min-height:347px;
height: auto!important;
height: 347px;
}
.decoracion{
background-image: url(caratulas/tira.gif);
background-repeat: repeat-x;
width:80%;
margin-left:auto;
margin-right:auto;
height:8px;
}
.decoracion2{
background-image: url(caratulas/tira.gif);
background-repeat: repeat-x;
width:100%;
margin:0px;
height:8px;
}
.decoracion3{
background-image: url(caratulas/tira.gif);
background-repeat: repeat-x;
width:100%;
margin:0px;
height:8px;
float:left;
}
.busqueda{
background-color: #000000;
float:left;
padding:5px;
}
.negro{
float:left;
background-color:#000000;
width:59px;
height:26px;
}
.negro2{
float:left;
background-color:#000000;
width:6px;
height:26px;
}
.decadas{
color:#000000;
float:left;
font-size:16px;
font-weight:bold;
padding-left: 5px;
padding-right: 4px;
padding-top: 1px;
padding-bottom: 1px;
border:solid 2px #000000;
background-color:#FFFFFF;
}
.genero{
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
color: #000000;
float:left;
text-transform: uppercase;
padding:1px;
background-color:#FFFFFF;
border:solid 2px #000000;
font-weight:bold;
margin-top:2px;
}
.genero2{
float:left;
}
div.genero:hover{
color: #FF0000;
text-decoration: none;
}
div.genero a:link{
color: #000000;
text-decoration: none;
}
div.genero a:visited{
color: #000000;
text-decoration: none;
}
div.genero a:hover{
color: #FF0000;
text-decoration: none;
}
.centrar{
text-align:center;
}
.fondovertical{
background-image:url(caratulas/fndv.gif);
float:left;
}
.formulario{
border-color:#000000;
margin-left:8px;
color:#000000;
padding-top:2px;
padding-bottom:2px;
font-weight:bold;
}
.espacio{
/*height:auto;*/
clear:both;
/*background-color:#000000;*/
}
.espacio2{
/*height:auto;*/
float:left;
width:100%;
clear:both;
/*background-color:#000000;*/
}
.fila{
text-align:left;
margin:0px;
float:left;
width:639px;
border-top: 1px gray solid;
padding-top:5px;
padding-left:5px;
}
.lista1{
width:10%;
margin-top:0px;
margin-left:0px;
margin-right:0px;
margin-bottom:5px;
float:left;
}
.lista2{
width:28%;
margin-top:0px;
margin-left:0px;
margin-right:0px;
margin-bottom:5px;
float:left;
}
.titular{
text-align:center;
margin-bottom:0px;
}
.titular2 ul li{
color:#000000;
font-size:20px;
}
.lista{
float:left;
margin:0px;
padding-left:0px;
padding-right:0px;
width:87%;
}
.lista ul{
width:100%;
text-align:left;
margin:0px;
padding:0px;
}
.lista ul li{
width:100%;
text-align:left;
list-style:none;
}
.listadetalle{
float:left;
margin:0px;
padding-left:0px;
padding-right:0px;
width:50%;
}
.listadetalle ul{
width:100%;
text-align:left;
margin:0px;
padding:0px;
}
.listadetalle ul li{
width:100%;
text-align:left;
list-style:none;
}
.imagen{
width:57px;
height:83px;
border:1px solid #000000;
/*padding-left:5px;
padding-top:5px;*/
}
.imagen2{
width:162px;
height:240px;
border:1px solid #000000;
float:left;
/*padding-left:5px;
padding-top:5px;*/
}
.negrita{
font-weight:bold;
}
.verde{
color:#64c216;
font-weight:bold;
}
.frm{
float:left;
width:auto;
height:auto;
}
.blanco{
background-color:#FFFFFF;
min-height:348px;
width:80%;
}
.fondoblanco{
width:20%;
float:left;/*
min-height:348px;*/
/*width:100%;*/
}
.lista2{
list-style:none;
}