CSS - расширение свойств класса ⇐ CSS

[Anonymous]

Я довольно новичок в CSS и до сих пор нахожу свой путь. Now there are several such buttons required on the site - everything about the buttons is same - except few properties change like width and font size.

Now instead of copying the same code - over and over for each button - is there a way of extending the button and adding just the properties that change.

Example of two buttons - css

.ask-button-display {
background: #8BAF3B;
border-radius: 4px;
display: block;
letter-spacing: 0.5px;
position: relative;
border-color: #293829;
border-width: 2px 1px;
border-style: solid;
text-align:center;
color: #FFF;
width:350px;
font-size: 20px;
font-weight: bold;
padding:10px;
}

.ask-button-submit {
background: #8BAF3B;
border-radius: 4px;
display: block;
letter-spacing: 0.5px;
position: relative;
border-color: #293829;
border-width: 2px 1px;
border-style: solid;
text-align:center;
color: #FFF;
font-weight: bold;
width:75px;
font-size: 12px;
padding: 1px;
}
< /code>

И так я сейчас использую его в своем html < /p>

Ask a Question Submit
< /code>

Так что мне интересно, есть ли более чистый способ сделать это - например, < /p>

.button {
/* PUT ALL THE COMMON PROPERTIES HERE */
}

AND THEN SOMEHOW EXTEND IT LIKE
.button #display {
/* THE DIFFERENT PROPERTIES OF Display BUTTON */
}

.button #ask {
/* THE DIFFERENT PROPERTIES OF Ask BUTTON */
}
< /code>

Но я не уверен, как это сделать.
Спасибо за ваши входы < /p>

Подробнее здесь: https://stackoverflow.com/questions/107 ... properties