A particular styling class named section-changing-input includes a subclass called Input. My aim is to give the input element a red border.
But, when I introduce this class into my <input> tag, nothing shows up.
What should I modify in the styling class within my div so that I achieve a red border?
import React from 'react'
import './style/General.scss'
function General() {
return (
<div>
<div className="field">
<p className="control has-icons-left has-icons-right">
<input className="section-changing-input" type="text" value="Hello" />
<span className="icon is-small is-left">
<i className="fas fa-futbol"></i>
</span>
</p>
</div>
</div>
)
}
export default General
General.scss
section-changing-input {
input {
border-color: crimson !important;
}
}