Why 2 Different MSN Home Pages

It looks even more different between FF and IE8.
Blue background is there in IE8, however in IE8 the page stretches all the way from left to right, while in FF it has wide margins on both sides.
The above comes from IE not reading correctly the code:

The width should be set in %, not px to fit all kind of screen resolutions.

In any case, it looks like that page is not coded right.

 

You're welcome

 

I went through the same thing...At home I saw the old page..I go to the office and turn on two pages and get two different MSN.com pages..Then I find out I was in a test group..



Sneak preview of MSN.com's new look
http://www.msn.com/preview.aspx


MSN Revamps Site with Focus on Social Networking
Microsoft has unveiled a much-needed redesign of the MSN.com site which includes feeds from Facebook and Twitter. The cleaner and more functional MSN.com could revive the concept of the web portal.http://www.pcworld.com/businesscent...mps_site_with_focus_on_social_networking.html

 

Well, I'm definitely at www.msn.com, not "preview" and the pages look different in IE8 and FF.

FF:
http://209.85.48.8/228/109/upload/p4423734.gif

IE8:
http://209.85.48.8/228/109/upload/p4423735.gif

 

Mine one machine didn't say preview on the address but showed the preview page...

I started a thread at VDR called: "How they do it" and even mailed my contact at MS..But never got an answer...It has since returned to the older/normal look.

 

msn.com is using javascript and css stylesheets and a browser sniffer scripts. If IE8 a certain stylesheet is used, if IE7 a different one, etc etc.

This is because IE 6 has poor css support, IE 7 fair css support, IE 8 better css support, FF 3.5x better yet css support, and so on.

But most of the content at msn is dynamic, fed via server side scripts (ASP and others) and the content layout and styling is done using javascript and css (DHTML). The dynamic content will break unless different stylesheets are used for each browser.

Not really, because the browser sniffer script and resolution sniffer determine which aspects of which stylesheet to use. And the most common screen resolutions used today are 1024x768 and 1200x800, thus the majority will be able to display 9xx pixels without a horizontal scrollbar.

It's impossible to have sites like msn look the same in all browsers. This is what it looks like in IE6 (1024x768 screen):

 

Arguing just gently, because I'm far from being HTML/CSS pro, just playing with them a little.

If you look at my FF screenshot, you'll see, that MSN page takes only part of my screen (1440x900).

If I change this:

to 100% instead of 979px

and then this:

to 84% instead of 769px, the page stretches to my whole screen
...and the above setting will work with any resolution.

Many of today's users use better resolution than 1024x768 and 1200x800, and it's mostly widescreen.

 

The CSS float property is handled differently by different browsers. For example, in IE 6 & 7, nested div with float styles can cause the right div to "drop down" a line lower than the adjacent divs. IE has always had troubles with the float property.

In your screenshot for FF, it shows the page centered in the window, which is exactly what the CSS is supposed to do. That's because it's feeding you a styled page especially for widescreen resolution (9:5 ratio).

Coding Web pages for 100% width on widescreen is shunned because it presents too many layout problems. Though, depending on the content, it can leave one with the feeling that "too much space is being wasted ".