Изменить значение свойства left

188

17 июля 2018, 19:00

Прошу помочь с информацией по несложному вопросу. Есть разметка:

    <div class="item"></div>
    <div class="item_2"></div>
    <div class="item_3"></div>
    <div class="item_4"></div>

Четыре элемента абсолютно спозиционированны,имеют след. значения:

item -> left 0;
item_2 -> left: 25%;
item_3 -> left: 50%;
item_4 -> left: 75%;

Могу ли я добавить к мои элементам класс, что бы их значение поменялось на + 15%?

Например добавить класс "active", после которого у :

item станет left 15%;
item_2 станет left 40%;
item_3 станет left 65%;
item_4 станет left 90%;

Если возможно, подскажите что нужно добавить в этот самый класс active.

active {
    ????;
}

Answer 1

Если менять именно значение left - то в лоб:

.item {left:0;}
.item_2 {left:25%;}
.item_3 {left:50%;}
.item_4 {left:75%;}
.active.item {left:15%;}
.active.item_2 {left:40%;}
.active.item_3 {left:65%;}
.active.item_4 {left:90%;}

Если же задача сдвинуть блоки и прописать стиль только для класса .active (чтобы не переписывать left у целой кучи элементов, если вдруг изначальные значения поменяются), то лучше навеситься на какое-то другое свойство, берущее величину в % из того же источника, что и left. Например, на margin-left: