Issue
I have created a stackblitz example here. I am tring to hide
but no matter whatever I try or look to override, I can't hide this underline.
I am trying to override it in styles.scss so that is changed across application
Solution
You can apply the below CSS to remove the bottom line.
body {
font-family: Roboto, 'Helvetica Neue', sans-serif;
margin: 0;
padding: 30px;
}
html,
body {
height: 100%;
}
mat-form-field {
.mat-mdc-form-field-type-mat-select {
background-color: #ffff !important;
}
.mat-mdc-text-field-wrapper {
border-bottom: none;
}
/* CSS to remove line - start */
.mdc-text-field--filled .mdc-line-ripple::before,
.mdc-text-field--filled .mdc-line-ripple::after {
border-bottom: 0px !important;
}
/* CSS to remove line - end */
}
Answered By - Naren Murali
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.