Is there a way to move a placeholder?

Question

I have some code:

<div class="txt-input">
<input id="txt-enter" type="text" placeholder="Enter To-Do">
</div>

But the placeholder is stuck to the left of the border. I want to have it 10px to the right, how do you do that? I do have a CSS file as well.

I tried ::placeholder but that didn't work. I also tried margin-left: 10px; put that didn't work either.

Answer 1

You're correct in using ::placeholder, you just need to using padding-left and not margin-left

#txt-enter::placeholder {
  padding-left: 10px;
}

Answer 2

You can use ::placeholder selector to set css for placeholder of input or textare.

input::placeholder {
  padding-left: 10px;
}

<input name="test_placeholder" placeholder="test placeholder" />