How can I put a flexible width div into a fixed width container?

What I want to do is to slide the content of the first div so that the only content shown would be what is not hidden by the outer div.

I am trying this, but doesn't work

#contenedorProductos {
margin-left: 50px;
float: center;
position: absolute;
width: 490px;
text-align: center;
z-index:1;
}

#contenedorProductos #contenidoProductos {
overflow: auto开发者_运维问答;
position: absolute;
width: auto;
}

My english skills don't let me explain better, hope this to be understood... Thank you.

You need to set overflow: hidden; on the outer div, and remove position: absolute; from the inner div (and possibly from the outer div - margin and float has no effect when using absolute position):

#contenedorProductos {

    margin-left: 50px;
    float: center;
    width: 490px;
    text-align: center;
    z-index:1;
    overflow: hidden;

}

#contenedorProductos #contenidoProductos {

    width: auto;

}