Yahoo! Sports Broken on Nexus 7

Yahoo! Sports was recently updated with an all-new design, following along with updates to other major sections of the site. There has been a lot of vocal feedback – common whenever a popular site has any design changes – but I’m warming up to it.

I only have one complaint: the site doesn’t work correctly on Nexus 7 tablets. Here’s a sample screenshot:

Yahoo! Sports Screenshot from Nexus 7

Yahoo! Sports layout is broken from Android Nexus 7 tablets (click for larger image)

I did some further testing on other Android tablets and phones and found it’s something unique about the Chrome browser on Nexus 7 that causes this problem. All other combinations worked correctly. Yahoo checks the browser user-agent to serve different styles, so there must be something broken for this particular device/browser combination.

Here’s a user-agent string that will cause the problem to appear:
Mozilla/5.0 (Linux; Android 4.3; Nexus 7 Build/JWR66Y) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/29.0.1547.72 Safari/537.36

This is easy to reproduce on desktop Chrome browsers as well:

  1. Start Chrome and navigate to sports.yahoo.com
  2. Open Developer Tools
  3. Open settings and change User Agent override to “Chrome – Android Tablet”
  4. Refresh the Yahoo Sports page

I captured a full-length page from Internet Explorer 10 with the Nexus 7 user-agent string as an override: yahoo-sports-it-nexus7.png (5 MB).