border:2px solid red VS border:2px red solid

Question

Are both method valid? both works same.

border:2px solid red;

and

border:2px red solid;

Answer 1

W3.org (the official spec) says that the value for the border shorthand property is this:

<line-width> || <line-style> || <color>

So it specifies that the order you should use is width, style, color. In other words, border: 2px solid red; from your example.

The other method is technically "undefined", but browsers usually display it correctly because there is no confusion between the style and colour values; there is currently no colour called "solid" or "dashed". Stick with the official method anyway.