Как реализовать градиентную границу в CSS3, где градиент выполняется горизонтально

Question

Я пытаюсь реализовать градиентную границу, я могу сделать это там, где градиент выполняется вертикально сверху вниз, но мне нужно реализовать его слева направо, приведенный ниже мой код.Заранее спасибо

border: 8px solid #000;
-moz-border-bottom-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-top-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-left-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-right-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
padding: 5px 5px 5px 15px; 

Answer 1

Вы можете подделать его с несколькими тенями: http://jsfiddle.net/zt2ve/

Answer 2

Эта страница покажет вам все, что вам нужно знать (за исключением неработающих браузеров, таких как IE)

http://robertnyman.com/2010/02/15/css-gradients-for-all-web-browsers-without-using-images/

И эта страница

http://www.westciv.com/tools/gradients/index.html

предоставляет графический интерфейс для создания градиента и генерации CSS (только для webkit / mozilla. Нет поддержки Opera или IE).