I have created an Input in my app and It works just fine but I am having a really hard time changing where text appears in the input field once I set the height. Ive tried using vertical-align: top justifying-content: flex-start setting the top padding to 0 Ive tried just about everything I can think to control where the text is falling inside the input but I cant move it...

 <div>
          <Input
            className="rxProviderNotes "
            value={providerNotes}
            onChange={providerNotesChange}
            name="assessment"
            id="assessment"
            placeholder="Type any additional notes..."
            type="text"
          />
        </div>

style is very minimal just setting height:

.rxProviderNotes {
  height: 185px;
}

but for some reason its showing up like this :