[Fixed] How to add border color on mat button , right border / left border?

Issue

I am trying to add right border color to a mat-stroked button , but i am unable to achieve the results .

<button class="example" mat-stroked-button>New <br /> Comment</button>

CSS-

    .example{
  color: red;
  border-radius: 3px;
  border-right: black;
}

But that doesnt work , replacing border-right with border gives the border throughout which i dont want , i want border color only at the right border .

Can anyone help me achieve this ?

Expected –

enter image description here

Note – Ignore the top and bottom border .

Thanks in Advance

Solution

Demo in this stackblitz link

You need border-right-color: black;

Your css class .example is as below..

.example {
  color: red;
  border-left: none;
  border-top: none;
  border-bottom: none;
  border-radius: 3px;
  border-right-color: black;
}

Leave a Reply

(*) Required, Your email will not be published