Tabla dentro de div con ancho dinamico

[MidnightMoon]

Saludos a todos.
Estoy recurriendo a ustedes, ya que tengo un problema con unos contenedores.
En una parte de mi sitio, tengo una estructura del siguiente tipo.

Código HTML:

<div>
    <div class="scrollTable">
        <table class="dataTable">
        <table>
    </div>
</dv>
 

El segundo div adopta el ancho al 100% del div contenedor. Este segundo div tiene un overflow, para cuando la tabla contenido es más ancha, se muestre la barra de desplazamiento.
Esto funcionaba bien, ya que las anchuras de los divs eran fijas a 980px.
Pero ahora, estoy transformando el sitio para que se adapte dinamicamente, por lo tanto tengo que usar porcentajes para esta parte.

El problema es que al asignarle un porcentaje al div, este se vuelve dependiente del ancho de la tabla, por lo tanto se desborda mi contenido, ya que por lo regular, el ancho de la tabla es más grande que el div contenedor.

El CSS para estos elementos, actualmente es el siguiente:

Código CSS:

.scrollTable{
    min-width: 980px;
    width: 100%
    position: relative;
    overflow-y: hidden;
    overflow-x: scroll;
}
.dataTable{
    border-collapse: collapse;
    border-spacing:  0px;
}
 

Para el div contenedor, simplemente es un width con porcentaje obtenido de otro div superior, por lo tanto no vi necesario ponerlo.

Espero me puedan ayudar con esto.

Nos estamos leyendo.

[pzin]

Iniciado por MidnightMoon

El problema es que al asignarle un porcentaje al div, este se vuelve dependiente del ancho de la tabla, por lo tanto se desborda mi contenido, ya que por lo regular, el ancho de la tabla es más grande que el div contenedor.

No entendí bien el problema. Si el div tiene un ancho en porcentaje, no debería de verse afectado por la tabla, ¿no? Si tiene un overflow: scroll, la tabla tendrá el ancho que tenga y no afectaría al elemento que la contiene.