El codigo CSS para lo que se ve en la imagen es el siguiente:
Código:
#main #right{
position:relative;
float:left;
/* border: red thin solid;*/
width:785px;
height:auto;
margin-left:10px;
}
#main #right #top_left{
position:relative;
float:left;
background-image:url(../img/content/top_left.gif);
width:7px;
height:7px;
}
#main #right #top_center{
position:relative;
float:left;
background:url(../img/content/top_center.gif) left repeat-x !important;
/* border: red thin solid;*/
height:7px;
width:400px;
}
#main #right #top_right{
position:relative;
float:right;
background-image:url(../img/content/top_right.gif);
width:7px;
height:7px;
}
#main #right #middle_left{
position:relative;
float:left;
background-image:url(../img/content/middle_left.gif);
background-repeat:repeat-y;
width:7px;
/* border:red thin solid;*/
height:100px;
}
#main #right #middle_center{
position:relative;
float:left;
/* border:green thin solid;*/
width:771px;
}
#main #right #middle_right{
position:relative;
float:left;
background-image:url(../img/content/middle_right.gif);
background-position:right top;
background-repeat:repeat-y;
width:7px;
/* border:red thin solid;*/
height:100px;
}
#main #right #bottom_left{
position:relative;
float:left;
background-image:url(../img/content/bottom_left.gif);
width:7px;
height:7px;
}
#main #right #bottom_center{
position:relative;
float:left;
background-image:url(../img/content/bottom_center.gif);
background-repeat:repeat-x;
height:7px;
/* border:red thin solid;*/
width:400px;
}
#main #right #bottom_right{
position:relative;
float:right;
background-image:url(../img/content/bottom_right.gif);
width:7px;
height:7px;
}
Como podreis observar, en top_center y bottom_center tiene asigando un width fijo de 400px, en el momento que yo le pongo auto no me pinta nada
También vereis que en el middle_left y middle_right tambié tiene un height asignado de 100px, me pasa lo mismo, en cuanto le pongo auto, no se me ve.
En los dos casos no me repite la imagen de 1px horizontalmente ni verticalmente.
Saludos!