Javascript LESS/CSS向输入添加第二个类以覆盖第一个类的宽度

我使用JQUERY向输入元素添加两个类：

JQUERY：

.addClass('dollar_input survey_txtBx');

问题：LESS/CSS使用的是.survey_txtBx设置的宽度，设置为50px，但我最近添加了.dollar_输入类来覆盖宽度并将其设置为150px

结果：在浏览器中，当我测试时，我看到两个类，但dollar_input width属性有一个穿过它的标记，告诉我surbey_txtBx正在提供width属性

CSS:

---

问题：我是否应该将美元输入设置为调查的子类\u txtBx？

您的浏览器将使用CSS定义中最准确的样式或文件中更高版本的样式

.classA {
    width: 100px;
}
.classB {
    width: 150px;
} 

如果元素具有

class=“classA classB”

元素的

宽度将是
150px
（因为
classB
存在于classA之后[在CSS定义中，而不是在
class=“…”
属性中]）

您可以检查此代码段：


div{
宽度：100px；
边框：1px纯红；
利润率：10px；
颜色：白色；
}
B.classA{
背景：蓝色；
}
.B类{
背景：黑色；
}
123
123通过CSS产生的影响：

.dollar_input.survey_txtBx {
  width: 150px;
}

这应该被视为最后一个解决方案，但作为一个快速解决方案
！重要信息
应可用于覆盖

.dollar_input {
   width: 150px !important;
}

如果两个类都应用于同一个元素，并且您无法控制类名的顺序，那么下面的方法应该有效

.survey_txtBx {
  width: 50px;

  &.dollar_input{
    width:150px;
  }
}

查看下面的尾随大括号
。测量\u txtBx
：-

    .survey_txtBx { 
       ...
    }
}
.dollar_input { 
   ...
}

#other-selector{
    .survey_txtBx{
       width:50px;
       ....
    }
    .dollar_input{
       width:150px;
    }
}

我假设
.survey\u txtBx
在另一个选择器中，如下所示：-

#other-selector{
    .survey_txtBx { 
       ...
    }
}
.dollar_input { 
   ...
}

在这种情况下，编译LESS时将创建以下内容：-

#other-selector .survey_txtBx { width:50px; }
.dollar_input { width:150px; }

一个简单的解决方法是将
.dollar\u input
与
内联移动。survey\u txtBx
：-

    .survey_txtBx { 
       ...
    }
}
.dollar_input { 
   ...
}

#other-selector{
    .survey_txtBx{
       width:50px;
       ....
    }
    .dollar_input{
       width:150px;
    }
}

这将使两者的权重与上次获胜的权重相同。
根据我提供的CSS，我在调查后设置了.dollar_输入{width:150px；}，但我仍然获得了50px的宽度？我将清除缓存并重新加载页面，以验证我的更改是否已被拾取。但是根据你的回答，我的代码不应该工作吗？应该，但是如果没有实际查看html+css，很难说。顺便说一句，这里的voteup会很好：）你知道。我也认为这是一个可能的解决方案。如果我无法弄清楚到底发生了什么，我会考虑这个选项。谢谢如果剩下的都已经准备好了，你只需要完成它，那就别再看了！顺序无关紧要。谢谢@BenG，你抓住了尾随括号，这让我很扫兴，因为我以为我把dollar_输入放在了行中，但之后，因为最后一个括号，我实际上超出了它……如果这有意义的话。