Javascript jquery css不'；我的情况不太好

我想使用jquery在css中对

calc（）

进行回退

CSS:

width: calc(100% - 90px);

var paxWidth = '-' + ($('.pax').width() + 10) + 'px';
console.log(paxWidth); // this return -90px
$('.datetime,.placeholder').css('width','100%').css('width', paxWidth);

所以我写了下面的代码，但第二个

css（）

似乎没有运行。我想有点不对劲，但我不知道

jQuery:

width: calc(100% - 90px);

var paxWidth = '-' + ($('.pax').width() + 10) + 'px';
console.log(paxWidth); // this return -90px
$('.datetime,.placeholder').css('width','100%').css('width', paxWidth);

---

当您在一行中使用

css

方法设置两次宽度时，第二次设置只会覆盖前一次设置。在模拟

100%-90px

宽度的情况下，您需要实际计算

px

中的此差值并应用结果

现在，百分比宽度

100%

是相对于父容器计算的，这意味着对于100%的值，您需要执行如下操作：

var paxWidth = $('.pax').width() + 10;
$('.datetime, .placeholder').css('width', function() {
    var parentWidth = $(this).parent().width();
    return parentWidth - paxWidth;
});

演示：

UPD。看看重复的答案，我可以确认我的上述解决方案没有什么意义，因为它可以像

$('.datetime, .placeholder').css('width', '100%').css('width', '-=90px');

---

演示：

设置两次

宽度的点是什么
paxWidth
只需重写
'100%
值。您提到paxWidth返回-90px。宽度不能为负。这可能是看起来像
pacWidth
包含类似
-90px
的内容的原因。你不能给HTML元素设置负数
宽度
。@Regent为什么这个人的答案得到了很多赞成票：？有趣，我不知道！我认为这是一个正确的方法。你试过了吗？