html - change height of right border -

this question has answer here:

• border length smaller div width? 9 answers

my right border 100% height:

border-right:1px solid #000000; 

i'd make shorter:

is achievable using css without changing height of div? need div 100% height , change border.

you can use pseudo element replace right border. can choose size/position of can simulate border :

fiddle

html :

<div></div> 

css :

div {     height:200px;     width:500px;     background:gold;     position:relative;     border-top:10px solid grey;     border-bottom:2px solid #000; } div:after {     content:"";     position:absolute;     top:20%;     right:0;     width:2px;     height:60%;     background:#000; } 

supports ie8 see caniuse