Tengo que soportar IE8. El modal en sí funciona bien, pero mis intentos de redimensionarlo (que funcionan bien en Firefox) no funcionan en IE8.

Solo estoy agregando una clase (modal amplio en este ejemplo) al div de diálogo modal (el segundo anidado en la estructura de Bootstrap) y aplicando un ancho a través de CSS, nada sofisticado.

HTML:

       <div class="modal fade" id="modalTest" role="dialog">
            <div class="modal-dialog wide-modal">
              <div class="modal-content ">
                <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                  <h4 class="modal-title">Testing Modal</h4>
                </div>
                <div class="modal-body">
                  <img src="content/Example-Infographic.jpg" width="100%" />
                </div>
                <div class="modal-footer">
                  <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
              </div><!-- /.modal-content -->
            </div><!-- /.modal-dialog -->
        </div>

CSS:

.wide-modal {
    width: 60%;
}

Intenté agregar la clase al div arriba y abajo a ningún efecto (positivo). Funciona como un encanto en Firefox, pero no tiene ningún efecto en IE8. También lo intenté con una anchura de px, sin diferencia. Tengo la biblioteca respond.js en su lugar, por lo que en general IE8 se está comportando de otra manera.