How do I add padding to this <textarea>?

Question

The is not resizable and It looks all weird and is not lined up :(

The amount is the textarea because I need it to be a textarea, not an input because I need to use .innerHTML in javascript to change the amount value when I click the arrows.

 textarea { width: 21%; margin-left: 12px; font-size: 18px; padding-left: 1.5em; font-weight: bold; background-color: #202023; border-radius: 10px; border: none; color: white; }

 <textarea id="myTextArea" placeholder="Amount"></textarea>

I would also love to have the textarea align with the other input/button!

Thanks for your time!! :)

Answer 1

You could use Bootstrap. Ex:

<div class="row align-items-center">
    <div class="col-md-4">
        Enter link input field
    </div>
    <div class="col-md-4">
        Your textarea
    </div>
    <div class="col-md-4">
        Create button
    </div>
</div>

Answer 2

Are the elements u want align in a single div?

try css float for textarea. Or better if applied to all elements that need to be aligned.