CSS border-image gradient on one side? -


the following css produces gradient border on left & right side of element:

div {      width: 100px;      height: 100px;      border-left: 10px solid;      border-image: linear-gradient(#00f,#000) 0 100%;  }
<div></div>

http://jsfiddle.net/5p8cv5t9/

how can apply gradient left side?

you can define no border width on other sides easily. issue stems fact default border-width (mdn) value medium, not 0.

div {      width: 100px;      height: 100px;      border-width: 0;      border-left: 10px solid;      border-image: linear-gradient(#00f, #000) 0 100%;  }
<div></div>


Comments

Popular posts from this blog

Fail to load namespace Spring Security http://www.springframework.org/security/tags -

sql - MySQL query optimization using coalesce -

unity3d - Unity local avoidance in user created world -