Pintando mapas...falla en el IE

[SetheR]

Hola a todos.
Veréis estoy haciendo un pequeño juego en javascript que consta de un tablero echo con un array de arrays.
La funcion que me genera en array es generarMapa(); y devuelve dicho array multidimensional, de ésta forma:

Código PHP:

  var mapa =[
                 [1,0,0,0],
                 [1,0,1,0],
                 [1,0,1,1],
                 [1,0,1,0],
                 ["a","b","c","d"]
                 ]; 
   

Donde los 0 son camino y los unos son muro.

Yo quiero "pintar" dicho array, con divs de diferrente colores, dependiendo del número entero almacenado en la posicion del array.
Para eso uso ésta funcion:

Código PHP:

  function formatearMapa(){
    //Variables de funcion.
    var mapa = generarMapa();
    var mpd = document.getElementById('mapa');
    var nombre;
    var local;
    var autor;
    var tamano;
    
    for (fila = 0; fila < mapa.length-1; fila++) { //El -1 es para no leer la ultima fila, la de los datos
        for (columna = 0; columna < mapa[0].length; columna++) {
            if (mapa[fila][columna] == 0) {
                mpd.innerHTML += '<div id="tile' + fila + columna + '" class="c0"></div>';
            }
            else if (mapa[fila][columna] == 1) {
                mpd.innerHTML += '<div id="tile' + fila + '-' + columna + '" class="c1"></div>';
            }
            else if (mapa[fila][columna] == 2) {
                mpd.innerHTML += '<div id="tile' + fila + '-' + columna + '" class="c2"></div>';
            }
            else if (mapa[fila][columna] == 99) {
                mpd.innerHTML += '<div id="tile' + fila + '-' + columna + '" class="c1"></div>';
            }
            //La segunda parte. Cuando las filas lleguen al final, sumamos uno para acceder a la
            //parte de los datos
            if(fila == mapa.length-1){
                fila++;
                nombre = mapa[fila][0];
                local = mapa[fila][1];
                autor = mapa[fila][2];
                tamano = mapa[fila][3];
                var datos = document.getElementById('datosmap');
                datos.innerHTML = nombre;
                datos.style.height = "30px"
            }
        }
    }    
    //Ajustamos el ancho y el fondo del div principal
    var ancho = mapa.lenght*30;
    mpd.style.width = ancho+ " px";
} 
   

La ultima fila, es para almacenar datos especificos de mapa (nombre, etc etc).

Las clases CSS solo les dan un display: inline-block; (y su correspondiente hack para la "%&$=ª" de IE).
El div "map" es donde van los divs que se generan en cada bucle.

EN Firefox, Opera, Chrome y Safari, se ve genial, tal como yo quiero, cuadradito por cada posicion de array. Pero en IE no me muestra nada, pantalla en blanco.

Yo supongo que puede ser que IE no represente el codigo html generado con javascript, no se..
Tambien he probado con el document.write();, pero sigue en blanco.

Alguna ayuda/tip/consejo??

Gracias por adelantado, es que llevo toda la tarde dándole vueltas y nanai

[zerokilled]

podrias subir un ejemplo funcional, aunque no funcione en msie? quiero intentarlo con msie a ver que error genera, si alguno. no encuentro algun indicio en el codigo como para no funcionar en msie. de momento lo unico que se me ocurre es utilizar DOM para crear elemento y agregarlo al documento.

[SetheR]

Hola. Gracias por responder. He simplificado el código que tenía en un par de archivos.
Los he colgado aquí: http:/ /sether.awardspace.biz
He probado a cambiar el CSS a ver si era fallo de eso, pero tampoco. Creo que el problema está en el javascript.

Un saludo y gracias. Sigo "investigando".

[zerokilled]

el problema esta aqui, especificamente la parte en azul. el mime type es incorrecto.

Código:

			<script type="application/javascript">
				formatearMapa();
			</script>

[SetheR]

Oh Dios, qu fallo más tonto. Es que como lo hago con el Aptana, ya sabes ENTER ENTER ENTER y enga.

Me has salvado, muchas gracias zerokilled!!

Un saludo