CSS + добавление к высоте и ширине унаследованных div

Question

Для работы мне нужно пройти и создать тонну html-страниц, и я обнаружил, что многие из созданных мной пользовательских классов можно использовать повторно, если я смогу найти способ добавления таких атрибутов, как высота и ширина.

пример:

.custom_class{font-size:1em;height:100px;width:80px;}

Допустим, у меня есть тот класс, который я использую во многих элементах div на своих страницах, но наткнулся на создаваемый мной шаблон, ширина которого должна быть немного шире. Скажем, мне нужна ширина 95 пикселей. Есть ли способ добавить + 15px к текущей ширине, и не нужно входить и узнавать текущую ширину 80px, а затем либо создать новый класс, либо сделать правильный встроенный css, чтобы компенсировать это?

.custom_class_differnt{font-size:1em;height:100px;width:95px;}

Я не хочу воссоздавать это полностью. Я надеялся, что есть способ просто сделать, возможно, style = "width: + 15px;" или что-то. (немного в строке CSS хорошо, но не более того)

спасибо

Answer 1

С JQuery вы можете добавить необходимую ширину:

$(".yourSelector").css("width","+=15px")

Это добавит 15px к текущей ширине.

Answer 2

Возможно, приемлемым решением будет просто предоставить дополнительные классы с альтернативной шириной (или другими стилями).

Например:

.custom_class {
    font-size: 1em;
    height: 100px;
    width: 80px;    
}
.custom_class.wide {
    width: 95px;
}

А затем в областях, где вам нужна шириначтобы быть шире, вы просто создали бы элемент, такой как <div class="custom_class wide">.

Answer 3

Обходной путь, который я использую, добавляет поля margin-left и margin-right.Поэтому, если бы я хотел ширину + 15px, я бы добавил margin-right: 15px