• Jueves 7 de Noviembre de 2024, 23:53

Autor Tema:  Maquetación 3 Columnas div  (Leído 3352 veces)

mash

  • Nuevo Miembro
  • *
  • Mensajes: 1
    • Ver Perfil
Maquetación 3 Columnas div
« en: Sábado 18 de Agosto de 2007, 20:04 »
0
Pues tengo problemas a la hora de visualizarlo con nuestro amado IEXPLORER.
El tema es el siguiente tengo hecho 3 columnas las de los laterales son de tamaño en EM y la del centro con %.
Utilizo la propiedad CSS display: table, table-row,table-cell.
Pues bien en firefox todo perfecto como no, pero en IE se ponen en filas una debajo de otra.
Se que el explorer no reconoce esos display o por lo menos el table-row, pero las soluciones que he encontrado o no funcionan o no hace el resultado que se desea.

Una de las soluciones es la de poner a las columnas la propiedad float:left, pero esto no me sirve ya que si nosotros aumentamos con el navegador el tamaño de las letras osease ctrl + en firefox la columnas laterales aumentan y la del centro se encoge que bueno mas o menos vale, pero con IE la del centro no encoje y la de la derecha se va hacia abajo ya que el div con propiedad display:table no crece.
Pues bien quiero solucionar eso que al aumentar el tamaño del texto se mantenga las columnas y no baje ninguna.
Código: Text
  1.  
  2. <html >
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  5. <title>Documento sin título</title>
  6. </head>
  7. <body>
  8. <div id="contenedor" style="display: table;">
  9.   <div id="row" style="display: table-row;">
  10.       <div id="izquierda" style="border:ridge #FF0000;width:15em;display: table-cell;">MMMMMMMMM</div>
  11.       <div id="central" style="border:ridge #00FF00;width:100%; min-width:10%;display: table-cell;">MMMMMMM</div>
  12.       <div id="derecha" style="border:ridge #FFFF00;width:15em;display: table-cell;">MMMMMMMMM</div>
  13.   </div>
  14. </div>
  15. </body>
  16. </html>
  17.  
  18.  

Ruben3d

  • Miembro HIPER activo
  • ****
  • Mensajes: 710
  • Nacionalidad: es
    • Ver Perfil
    • Web personal
Re: Maquetación 3 Columnas <div>
« Respuesta #1 en: Domingo 10 de Febrero de 2008, 21:17 »
0
Three Column Layouts

Aunque hace bastante tiempo de este post dejo este enlace como referencia.

Un saludo,

Ruben3d