使用 Foundation 覆盖 Richfaces Css

Question

我正在使用 rich:calendar，我想覆盖它的 css，如下所示 text-box 应具有 11 列宽度（如 .small-11）

但我得到以下输出

SCSS

*.rf-cal-inp {
    @include grid-column($columns: 11);
}

*.rf-cal-btn {
    float: right;
}

实际上 width 和 padding 被重写如下

input[type="text"] {
  margin: 0 0 1rem 0;
  padding: 0.5rem;
  width: 100%;
}

我想要的是使用 !important 覆盖 richfaces 组件。如何在我的 scss 中为 width 和 padding 放置 !important？

Answer 1

作为 !important 的替代方法，您是否尝试过使用更具体的选择器？

input[type="text"].rf-cal-inp {
  width: auto;
  padding: 1px 0;
}

您也可以使用 input[type="text"][id*="calendar"] 仅定位那些小部件。

Override Richfaces Css using Foundation