Circle with box-shadow half one color and half another?

[toolman]

Hi,

I have the following CSS which creates a cirlce with a border and box shadow. What I would like to do is to have the box shadow have a top half in one color and the bottom in another color. Is this possible

div {
    width: 120px;
    height: 120px;
    border: 5px solid #ddd;
    box-shadow: 0px 0px 0px 5px #fff;
    border-radius: 50%;
    background: #fff;
    float: left;
    margin-right: 15px;
}

Thanks

[SamA74]

You can add multiple shadows by separating with commas (example 2) but I don’t know about having a gradient in a shadow.
You can have multi colour borders, or gradients in borders using border-image, but I don’t have it working with round corners yet.