css - 如何将 Angular Clarity Design 4.0 输入宽度设置为 100%？

Question

对于旧版本，我可以轻松覆盖 Clarity Design 表单控件的默认 CSS 行为以使用 100% 的父宽度。

使用 4.0 版本，我什至无法style="width: 100%"在 Chrome Inspector 上设置clr-input-container所有子元素（clr-control-container, clr-input-wrapper, input）。

任何人都有运气尝试使 Clarity Design 4.0 的输入元素适合 100% 宽度？

标签： cssangularvmware-clarity

Answer 1

您可以使用clr-*类在输入上应用样式。例如，

.clr-input,
.clr-input-wrapper {
  max-width: 100%;
  width: 100%;
}

.clr-control-container, 
.clr-input-wrapper.clr-input {
  padding-left: 0;
  padding-right: 0;
}

看看这个stackblitz。