0

I have been working on a new design for our website and have run into an issue with IE that only happens on the live server.

In any browser except IE, it shows up normal. In IE, as you can probably see, it won't read the margin I have set. If I pull the site straight off of my computer, not off the live server, in IE everything looks perfectly fine. I don't understand why this problem would only show up once the site is live, and I also don't know exactly what to do to fix it without messing up the look in other browsers or removing the jquery to resize based on browser width. Help!

I think this is the relevant code:

$(window).resize(function(){
  resizeUI();
}); 
$(document).ready(function(){
  resizeUI();
});
// resize on page load AND window resize
function resizeUI(){
 if($(window).width() > 960){
 $('.top, #navmenu').css('position', 'fixed');
 $('#container').css('margin','0 0 0 50%');
 $('#container').css('left','-480px');
 }
 else{
 $('.top, #navmenu').css('position', 'absolute');
 } 
} ;

From what I can tell it has something to do with the fact that all computers on campus have IE Document mode being set to IE7 instead of IE9. If possible, I need a workaround for this!

user2333018
  • 27
  • 5
  • What version of IE are you using? The page looks exactly alike for me both in IE 10 and Chrome – DanielX2010 Aug 01 '13 at 17:20
  • what version of IE? and which margin? – user1721135 Aug 01 '13 at 17:21
  • please include the relevant code that deals with you applying the margin and the html that uses the margin. – Patrick Evans Aug 01 '13 at 17:21
  • 1
    I am seeing exactly the same in Chrome and IE8, IE9 and IE10. No differences. – Sarvap Praharanayuthan Aug 01 '13 at 17:27
  • This is crazy! Our computers on campus all have IE 9 on them and they all pull it up with the funky margins. What should I be looking for? What could possibly be the difference? – user2333018 Aug 01 '13 at 17:28
  • Add a screen shot of the "funky" margins on IE9 as you see it. This way we can see what the issue is because it looks good to me on IE 9. – Gloria Aug 01 '13 at 17:32
  • IE7 shows the whole content shifted to right side.I am not sure if this is what you are seeing. – anpsmn Aug 01 '13 at 17:49
  • There's some invalid HTML in your code. The first and worst is the incorrect doctype declaration. IE is really bad when it has to parse invalid HTML. You can check your code with [`W3C Validator`](http://validator.w3.org/). – Teemu Aug 01 '13 at 18:18

1 Answers1

0

Check if IE is running in compatibility mode when accessing the site from the live server. I've had this happen to me several times when testing a site locally versus a deployed version.

asymptoticFault
  • 4,349
  • 2
  • 17
  • 23
  • What do you mean? If I open developer tools in IE I can change it to IE9 Compatibility, but once I do that and refresh, it still looks terrible! – user2333018 Aug 01 '13 at 17:28
  • I am referring to this http://windows.microsoft.com/en-us/internet-explorer/use-compatibility-view#ie=ie-9 – asymptoticFault Aug 01 '13 at 17:30
  • Ok, it has something to do with Document mode being set to IE7 instead of defaulting on IE9. All computers on campus are set like this though -- do you know of a workaround I could use? – user2333018 Aug 01 '13 at 17:32
  • 1
    IE has a tendency to render intranet sites in compatibility mode. Check this out http://stackoverflow.com/questions/12894082/how-to-prevent-ie9-from-rendering-intranet-sites-in-compatibility-mode – asymptoticFault Aug 01 '13 at 17:34
  • This may also be illuminating http://answers.microsoft.com/en-us/ie/forum/ie9-windows_7/internet-explorer-9-works-properly-with-an/67b0610e-69b0-40ea-98d9-c4486bfb09f5?msgId=21570036-a892-4576-ad48-6ffefee9d5fe – asymptoticFault Aug 01 '13 at 17:38
  • Everyone here accessing the site and seeing it fine while everyone on campus is seeing the issue lends credence to it being an intranet/compatibility mode issue. – asymptoticFault Aug 01 '13 at 17:44