Zach’s ugly mug (his face)

Zach Leatherman

Google Using YUI Grids CSS

05 Apr 2007 Zach Leatherman

Head over to the Google Homepage. Log In using your Google Account. Make sure you’re at your Personalized Homepage. Take a look at the source CSS file ig.css included on the page. There are a few peculiar lines of code that I recognized from another source, the Yahoo User Interface Grids CSS file. Yahoo has provided a set of standard CSS definitions under the BSD license that allow a developer to easily make fluid or fixed width column layouts. And on the Google Personalized Homepage, there are the following class definitions:

#modules .yui-b{position:static;display:block;margin:0 0 1em 0;float:none;width:auto;overflow:hidden;}
.yui-gb .yui-u{float:left;margin-left:2%;*margin-left:1.895%;width:32%;}
.yui-gb div.first{margin-left:0;}

This code includes identical Class names taken from the Yahoo User Interface library Grids CSS component. Here is the source in the grids.css file from Yahoo (truncated for simplicity).

#yui-main .yui-b{position:static;}
.yui-t7 #yui-main .yui-b {
display:block;margin:0 0 1em 0;
#yui-main .yui-b {float:none;width:auto;}
.yui-gb .yui-u{float:left;margin-left:2%;*margin-left:1.895%;width:32%;}
.yui-gb div.first{margin-left:0;}

Obviously, it’s the same code, with a few minor differences.

Screenshot proof

The interesting thing to note is that the YUI Grids CSS source code is licensed under a BSD license, which includes the following provisions:

Redistributions of source code must retain the above copyright notice, this list of conditions and the
following disclaimer.

The copyright notice they’re referring to is not included anywhere on the Google Personalized Homepage (and would seem to be a violation of the license). Now this may seem like a small infraction when we’re just talking about 4 lines of CSS code. But really, if they think the code is good enough that they will use it in such a prominent way and not write it from scratch using their own means, they should follow the licensing agreements stipulated.

Google has added the BSD license statement and attribution to Yahoo in their CSS file (ig.css):

/* ===============BEGIN BSD LICENSED PORTION============= */
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
version: 2.2.0

#modules .yui-b {
margin:0 0 1em 0;
.yui-gb .yui-u {
.yui-gb div.first {
#modules,.yui-gb {
/* ===============END BSD LICENSED PORTION============= */

Sorry to everyone visiting the page for the extra millisecond or two it will take to load these comments.


➡ Load Disqus to Leave a Comment ⬅

There also seems to be significant overlap with the YUI CSS and font reset stylesheets. Compare these:

... to the first few lines of this:


I work on open source compliance at Google and we're fixing the attribution issue. This is not cool at all but it will be fixed soon. Thanks.


Isaac Z. Schlueter

10 Apr 2007 at 04:22PM

Is this really a "redistribution" of the source code?

Use of the code is free to all, with or without attribution. If Google decides to distribute code as part of a new package in either binary or source form, and that product uses or extends the YUI lib, then they'll have to include the attribution.

AFAIK, that's how the BSD license works. (Of course, me !== IP lawyer.) But of course attribution is friendly, and a definite "good karma" kind of thing in all cases. And it's rather cool that Google is using our open-source tools; the YUI folks should be flattered.

I'm a much bigger fan of the WTFPL for public open-source software, myself ;)

Hey updong.
It was surprised about KR posting in here. hehe

Technically, it is not distribution to put bsd code on a webpage even though that page is 'downloaded' to a webclient. We don't mind giving credit though.

Zach Leatherman

10 Apr 2007 at 06:08PM

Isaac, it would seem that you are correct.

The first sentence of the BSD license is as follows:

Redistribution and use of this software in source and binary forms, with or without modification, are permitted provided that the following conditions are met...

But then the first condition only applies to redistribution and not to use. What restrictions are placed on use under the BSD license, if any?

I hope that my misinterpretation of the license isn't deemed sensationalist, I really just thought it was interesting that YUI code was on the Google homepage. That's why the title of the article is what it is, and not "Google is stealing Yahoo's code" as some have repackaged it.

I do not believe this

Joseph Okharedia

20 Jan 2010 at 07:07AM

I been in love with google's simple but yet elegant UI look. I'm highly surprised that yui is part of their look. Does anyone have any idea if yui javascript has been used for any of their wonderful widgets like drop down menu.

Zach Leatherman

20 Jan 2010 at 10:26PM

Hey Joseph,
I'd imagine they're using a combination of their own Closure Library and GWT.