Removal of common properties or abbreviated notation?

Question

css

Which option is better? In the first case, not an abbreviated notation is obtained, three rules instead of one, in the second, the repetition of the same values
​​1.

.btn-social
    border: 1px solid red
    background-repeat: no-repeat
    background-position: center
.btn-social--fb
    background-image: url(...)
.btn-social--twitter
    background-image: url(...)

2.

.btn-social
    border: 1px solid red
.btn-social--fb
    background: url(...) no-repeat center
.btn-social--twitter
    background: url(...) no-repeat center

Answer 1

I prefer the first option. Code is easier to read and easier to maintain when properties are grouped.
Of course, you should not adhere to this rule until you foam at the mouth either: proceed from the context of the specific task and do it in the most logical way.