481719 - msnbc.com -- MSNBC header menu displays improperly, probably due to bad sniffing

Status: RESOLVED WORKSFORME

(Web Compatibility :: Site Reports, defect)

Description

[John]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9.2a1pre) Gecko/20090305 Minefield/3.2a1pre
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9.2a1pre) Gecko/20090305 Minefield/3.2a1pre

The header menu on MSNBC.com does not display on one row on the Minefield trunk. It is not my screen resolution, because I also tested it on 3.0.6 and Chrome and it works fine.

Reproducible: Always

Steps to Reproduce:
1. Visit http://msnbc.com
2. Observe top navigation header
Actual Results:  
The sports link glitches down to the next line and is semi-hidden. Also, the MSN image seems to be duplicated. This does not happen in other browsers.

Expected Results:  
The menu items should be on one line and the MSN image should not repeat.

Comment 1

[Mardeg]

The sports link is also on the next line in Opera 10a1.
I also noticed in all browsers if the screen is narrower than the header, scrolling to the right shows no background behind the sports link making it almost invisible.

Comment 2

[u88484]

I see the duplicated msn image at the very top right but not the other issue.  However, I can not click/hover over the head items to get the underlying menu except for the today show and nightly news header.

Comment 3

[John]

I don't care what Opera does. We need to make sure Gecko displays it properly if Webkit can.

Comment 4

[Sylvain Pasche]

Bad sniffing strikes again:
Set your useragent to Firefox: the header is on one line
Set your useragent to something else (Minefield, Shiretoko, ...): the header is on two lines.

Comment 5

[Sylvain Pasche]

(In reply to comment #3)
> I don't care what Opera does. We need to make sure Gecko displays it properly
> if Webkit can.

We do care about the rendering of other browsers, that helps finding if the issue is browser specific or not.

Comment 6

[Sylvain Pasche]

I'm filling another bug for the duplicate background image.

Comment 7

[Sylvain Pasche]

Filed bug 481769 for the duplicate background. I'm morphing this bug into a tech evangelism one. The browser detection should deal with all Gecko browsers (if needed at all).

If someone could produce detailed report and contact the webmaster that would be great.

Comment 8

[Chris Lawson (gone)]

(In reply to comment #4)
> Bad sniffing strikes again:
> Set your useragent to Firefox: the header is on one line
> Set your useragent to something else (Minefield, Shiretoko, ...): the header is
> on two lines.

I can't reproduce this in a recent Camino trunk nightly with the "Firefox" portion of the UA string removed. I get the navbar all on one line.

http://www.msnbc.msn.com/js/std.js

appears to be the script file hosting all their sniffing. They actually sniff for "Gecko" (although for some strange reason, they sniff for "Firefox" separately). I didn't bother investigating further than that, but someone else is more than welcome to.

Comment 9

[philippe (part-time)]

(In reply to comment #2)
> I see the duplicated msn image at the very top right but not the other issue. 
> However, I can not click/hover over the head items to get the underlying menu
> except for the today show and nightly news header.

That is caused by that duplicated image (bug 481769). I nuked the li that contains the image with Firebug, as a result the whole navigation bar slides upwards (where it should be) and is clickable. Otherwise, the weather forecast widget covers the menu list and prevents clicking on some of the items.

I can't repro the other issue (wrapping) at any text size with
Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.2a1pre) Gecko/20090305 Minefield/3.2a1pre

Comment 10

[Sylvain Pasche]

Apparently, browser detection sets some classes on the body element, and different css rules apply that may put the header in two lines.

On Linux, with Useragent: 
Mozilla/5.0 (X11; U; Linux i686 (x86_64); en-US; rv:1.9.1b2) Gecko/20081201 Firefox/3.1b2
I get this class on the body:
class="Linux Firefox Firefox-3 Linux-Firefox"

If I change the UA to:
Mozilla/5.0 (X11; U; Linux i686 (x86_64); en-US; rv:1.9.1b2) Gecko/20081201 Foo/3.1b2
I get this class on the body:
class="Linux Mozilla Mozilla-1 Linux-Mozilla"

When the "Firefox" class is there, the "margin-left" property on the "Today Show" <li> element is set, which prevents the text from wrapping.

I see the same issue on Windows.

Maybe on Mac the css classes are set differently and other rules match that may prevent the issue?

Comment 11

[Chris Lawson (gone)]

Since multiple people are seeing at least part of this issue, confirming. Who wants to send them a TE letter?

Comment 12

[Willie Reid]

A bit late but I see the NBC Sports link split over two lines in Seamonkey.

Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9.1pre) Gecko/20090522 SeaMonkey/2.0b1pre - Build ID: 20090522031548

Comment 13

[u88484]

Attachment: Possibly related screenshot

Not sure if this is related but when a breaking news banner shows up, half is hidden.

Comment 15

[Karl Dubost💡 :karlcow]

No issue identified with this new site.