Hola que tal, llevo como 3horas dandole vueltas y probando una página bastante compleja en cuanto a maquetación y me he topado con un problema que no logro solucionar.
Tengo lo siguiente:
Código HTML:
<html>
<head>
<style type="text/css" media="screen">
.content {
position: absolute;
height:100%;
width: auto;
max-width: 100%;
overflow: hidden;
overflow-x: auto;
white-space: nowrap;
}
div.content span.content2 {
width: 300px;
height: 100%;
display: inline-block;
border-left: 1px solid black;
}
</style>
</head>
<body>
<div class="content">
<span class="content2">
1
</span>
<span class="content2">
2
</span>
<span class="content2">
3
</span>
<span class="content2">
4
</span>
<span class="content2">
5
</span>
<span class="content2">
6
</span>
</div>
</body>
</html> Esto funciona. El scroll solo sale dentro del div horizontalmente que ocupa el ancho completo de la pantalla con los span alineados SOLO en horizontal, mi problema es que necesito que en vez de spans sean divs ya que dentro de esos spans actuales donde pone (1 2 3...) tengo que maquetar otros divs en posicion relativa y claro, poner divs en vez de span en el puñetero IE no funciona (chrome y ff si), además he intentado maquetar dentro de los spans, pero tampoco funciona.
¿Alguien ha trabajado o sabe como trabajar con divs dentro de divs con scroll? ¿O alguién sabe como maquetar dentro de spans de una manera que funcione?
Gracias y un saludo