text indent inside input box with percentage subtraction

Question

is there a way to do a text indent inside an input box such that the text is halfway in the box but offset to the left by 20 pixels?

.my-input {
    text-indent: calc(50%-20px);
}

Getting an error

Answer 1

Your only mistake is that you forgot to separate the operation with spaces inside the calc() function. Changing it into this made it work.

.my-input {
    text-indent: calc(50% - 20px);
}