Search code examples
htmlcssangulartypescriptangular2-nativescript

border-radius-top-left is not working with Angular2

I am trying to curve my button from specific corners, but it is not working with my NativeScript App. Here is my CSS code:

border-bottom-left-radius:10;
border-top-left-radius:10;
border-top-right-radius:0;
border-bottom-right-radius:0;

I have tried to add px at the end, but it does not work with Angular2 CSS. I also tried to put them all in one line like this:

border-radius: 3px 3px 0px 0px;

but it did not work with and without px.

Solution

  • You may need the px

    border-bottom-left-radius:10px;
border-top-left-radius:10px;
border-top-right-radius:0;
border-bottom-right-radius:0;

    If that doesn't work try to add !important to overwrite the other css rules. 

    border-bottom-left-radius:10px !important;
border-top-left-radius:10px !important;
border-top-right-radius:0 !important;
border-bottom-right-radius:0 !important;