How to write variable with multiple css properties in Sass

Question

I'm learner of Sass, and want to include border radius of 25px with browser compatibility but getting error. Any help would be appreciated.

$red: #F00;

$border-radius: 
            -webkit-border-radius:25px; 
               -moz-border-radius:25px; 
                    border-radius:25px;

h5 {
    font-size: 12px;
    padding: 20px;
	border-radius: $border-radius;
	background: $red;
}

Answer 1

Try using a mixin. Here's an example from the Mixin section:

@mixin border-radius($radius) {
  -webkit-border-radius: $radius;
     -moz-border-radius: $radius;
      -ms-border-radius: $radius;
          border-radius: $radius;
}

You can use this like so:

h5 {
    @include border-radius(25px);
    font-size: 12px;
    padding: 20px;
    background: $red;
}