如何使定位到合适的元素：0，如果它已经离开：0的风格在它的类

Question

一个我有A级的元素，规则：

.A { 
    left: 0px; 
} 

出于某种原因，我需要将元素放在容器内的正确位置，我不能排除A类。

Answer 1

特异性是你的朋友在这里：

这里有几个选项....

覆盖使用附加的特性，例如另一个类（或ID）

.container { 
 
    height: 50vh; 
 
    position: relative; 
 
    width: 50%; 
 
    bordeR: 1px solid grey; 
 
    margin: auto; 
 
} 
 
.A { 
 
    position: absolute; 
 
    height: 25px; 
 
    width: 25px; 
 
    left: 0; 
 
    background: #000; 
 
    margin-bottom: 1em; 
 
} 
 
.A.right { 
 
    left: auto; 
 
    right: 0; 
 
    background: red; 
 
}

<div class="container"> 
 
    <div class="A"></div> 
 
    <div class="A right"></div> 
 
</div>

类

或第n个孩子选择

.container { 
 
    height: 50vh; 
 
    position: relative; 
 
    width: 50%; 
 
    bordeR: 1px solid grey; 
 
    margin: auto; 
 
} 
 
.A { 
 
    position: absolute; 
 
    height: 25px; 
 
    width: 25px; 
 
    left: 0; 
 
    background: #000; 
 
    margin-bottom: 1em; 
 
} 
 
.A:nth-child(2) { 
 
    left: auto; 
 
    right: 0; 
 
    background: red; 
 
}

<div class="container"> 
 
    <div class="A"></div> 
 
    <div class="A"></div> 
 
</div>