CSS: Stripe with multiple colors

Question

I have a navigation bar and want it to have a border at the bottom like a multi-colored stripe. For example, Google uses a multi-colored stripe like this:

Answer 1

I think you're much better doing this with a background image. You can keep the image really tiny by making each colour 1px wide and your image file 1px tall (they'll scale perfectly, with crisp edges).

An example:

.navigation-bar:after {
    content: " ";
    height: 6px;
    width: 100%;
    background: url(../img/stripe.png) repeat;
    background-size: 100% 1px;
}