Четкость высоты текстового поля для соответствия высоте страницы мастера

Используя Clarity и Angular 9, у меня есть кнопка в области основного содержимого, которая открывает мастер. Теперь в мастере у меня есть текстовое поле, которое я хочу заполнить областью содержимого мастера. Я могу получить ширину текстового поля, установив ширину: 100%.

Но я не могу заставить то же самое работать с высотой.

Вот ссылка на stackblitz, которая показывает проблему. https://stackblitz.com/edit/clarity-form-reset-xtyait


javascript angular css vmware-clarity
person Shankar M Rudraiah    schedule 29.07.2020    source источник

Ответы (1)


arrow_upward
1
arrow_downward

textarea получает размер от своего родителя.

Некоторые css togehter с Angular ::ng-deep сделают это. :

::ng-deep .clr-control-container {
  height: 100%!important
}

::ng-deep .clr-textarea-wrapper {
  height: 100%!important
}

::ng-deep .clr-form-control {
  height: 100%!important
}

::ng-deep .clr-wizard-content {
  height: 100%!important
}

Вот ваш Stackblitz. с измененным размером текстового поля.

person zerocewl    schedule 29.07.2020
comment
!important действительно требуется? Вместо этого вы должны придать ему более высокую специфичность. uxengineer.com/css-specificity-avoid-important-css I ' m почти искушение проголосовать против, потому что !important - такая плохая практика, очень похожая на eval - person Juan Mendes; 30.07.2020