ASP.Net hosting with HTML5 JS and Twitter bootstrap formats differently

Question

In my development environment, everything looks great, I have a pie chart that uses canvas and animation. This is clearly visible when placed through a browser.

I also use Twitter Bootstrap and has a navigation bar at the top of the page that has two elements.

Here are some examples:

In development environment

http://i.stack.imgur.com/TtC5J.png

IIS Hosting

http://i.stack.imgur.com/DNLkg.png

After rejecting the IIS version, the error remains constant, and you may also notice that the rounding of the button is not exactly the same.

We host on IIS6 with default settings, so we are wondering if something needs to be done on the site in order to bind it correctly? I do not register .LESS wherever I don't think I'm not sure if this could be the reason for this.

Thanks in advance.

Answer 1

You need to install the X-UA-Compatible meta tag to fix this. Add the following meta tag to your title on your web page and the problem should be resolved.

This will ensure that it looks the same in development and in IIS. (using the same browser)

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

You can also add the following directive to your web.config to add a custom header application, not a meta tag for each page.

 <?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> 

This behavior is caused by the fact that, by default, IE creates intranet sites in the compatibility module. (since Microsoft believes that many intranet sites are out of date, I think) You can change this by choosing Tools → ViewSettings Compatibility.

Literature:

• 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

Answer 2

It sounds like you are using LESS, is that right? If this is the case, as you already mentioned, you need to configure it in IIS in order to use twitter boostrap if you use functions that require LESS.

I had similar problems with IIS and it correctly recognized file extensions if they are not the default values ​​in IIS.

Most likely, your local host is not so protected with regard to file associations, or you are using a different version of IIS locally than IIS6, and it already allows the extension .less.

To fix this, you need to add extension / mapping in IIS6.

Short version

• Open Web Application Properties
• Click Configuration ...
• On the Mapping tab, click Add
• Executable file . Enter the same value as for the .aspx extension on the Mappings tab
• Extension : .less
• Verbs : check the box: Restrict, enter: GET, HEAD
• Script Engine : Verified
• Make sure the file exists : not checked

The graphical version, if it helps someone: here is a link with the details that I reproduced below, in case of its disappearance.

http://wiki.uiowa.edu/display/~mbergal/2012/06/08/Configuring+IIS+6+to+support+dotlesscss+(LESS+CSS)

Go to site properties.

Open configuration

Add extension