Programación Web y Scripting > CSS / SASS / LESS
Maquetación 3 Columnas div
(1/1)
mash:
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 --- <html ><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Documento sin título</title></head><body><div id="contenedor" style="display: table;"> <div id="row" style="display: table-row;"> <div id="izquierda" style="border:ridge #FF0000;width:15em;display: table-cell;">MMMMMMMMM</div> <div id="central" style="border:ridge #00FF00;width:100%; min-width:10%;display: table-cell;">MMMMMMM</div> <div id="derecha" style="border:ridge #FFFF00;width:15em;display: table-cell;">MMMMMMMMM</div> </div></div></body></html>
Ruben3d:
Three Column Layouts
Aunque hace bastante tiempo de este post dejo este enlace como referencia.
Un saludo,
Ruben3d
Navegación
Ir a la versión completa