Búsqueda de sitios web

javascript - Hospedaje de ASP.Net con HTML5 JS y Twitter Bootstrap se formatea de manera diferente

En mi entorno de desarrollo todo aparece perfectamente, tengo un gráfico circular que usa un lienzo y animación, esto aparece bien al alojarlo a través del navegador.

También estoy usando Twitter Bootstrap y tengo una barra de navegación en la parte superior de la página, que tiene dos elementos.

Aquí hay algunos ejemplos:

En el entorno de desarrollo

https://i.sstatic.net/TtC5J.png

Alojamiento en IIS

https://i.sstatic.net/DNLkg.png

Después de descartar la versión de IIS, el error permanece constante, además puedes notar que el redondeo del botón no es exactamente el mismo.

Estamos alojando en IIS6 con la configuración predeterminada, así que me pregunto si hay algo que deba hacerse en el sitio para incorporar esto correctamente. No estoy registrando el .LESS en ningún lado, no lo creo, así que no estoy seguro si eso podría estar causando esto.

Gracias de antemano.

Respuesta #1

Necesitas configurar la etiqueta meta X-UA-Compatible para solucionar esto. Agrega la siguiente etiqueta meta en el encabezado de tu página web y el problema debería solucionarse

Esto asegurará que se vea igual en desarrollo y en IIS. (usando el mismo navegador)

<meta http-equiv="X-UA-Compatible" content="IE=Edge">

También puedes agregar la siguiente directiva en tu web.config para agregar un encabezado personalizado en toda la aplicación en lugar de la etiqueta meta por página.

<?xml version="1.0" encoding="utf-8"?>
<configuration>
   <system.webServer>
      <httpProtocol>
         <customHeaders>
            <clear />
            <add name="X-UA-Compatible" value="IE=Edge" />
         </customHeaders>
      </httpProtocol>
   </system.webServer>
</configuration>

Este comportamiento se debe a que IE representa los sitios de la intranet en modo de compatibilidad por defecto. (porque Microsoft piensa que muchos sitios de intranet están desactualizados, supongo) Puedes modificar esto yendo a Herramientas -> Configuración de vista de compatibilidad.

Referencias :

  • http://weblogs.asp.net/rajbk/archive/2010/05/12/pages-in-ie-render-differently-when-served-through-the-asp-net-development-server-and-production-server.aspx
  • http://msdn.microsoft.com/en-us/library/cc288325(v=vs.85).aspx

Respuesta #2

Parece que estás usando LESS, ¿es correcto? Si es así, como mencionaste, necesitas configurarlo en IIS para usar el twitter boostrap si estás usando esas características que requieren LESS.

He tenido problemas similares con IIS y he logrado que reconozca correctamente las extensiones de archivo cuando no son las predeterminadas en IIS.

Es probable que tu localhost no sea tan protector con los mapeos de archivos o que estés usando una versión diferente de IIS localmente que IIS6 y que ya permita la extensión .less.

Para solucionar esto, necesitas agregar la extensión/asignación a IIS6.

Versión corta

  • Abrir propiedades de la aplicación web
  • Haga clic en Configuración...
  • En la pestaña Mappings, haga clic en Add
  • Ejecutable: Introduzca el mismo valor que está configurado para la extensión ASPX en la pestaña de Mapeos
  • Extensión: .less
  • Verbos: Comprobar: Limitar a, Introducir: GET, HEAD
  • Motor de secuencias: Comprobado
  • Verificar que el archivo exista: No marcado

Versión gráfica si a alguien le ayuda: Aquí hay un enlace con detalles que he reproducido a continuación en caso de que desaparezca.

http://wiki.uiowa.edu/display/~mbergal/2012/06/08/Configurando+IIS+6+para+soportar+dotlesscss+(LESS+CSS)

Ve a las propiedades del sitio.

Abrir la configuración

Agregar la extensión