How to put the prompt/placeholder of my input field in the middle?

Thank you. 

Champion
Solution

Hi  Jakerson Bermudo,


Add  below css at your screen. this will make placeholder in middle .

::placeholder {  
  text-align: center; 
}


For particular input you can use CSS selector. 

input[id^="Input_Num"]::placeholder {  
  text-align: center; 
}


Please check attached oml.

Regards,

Rahul

Lab_PH-2.oml

Hi @Rahul Kumar, I have another question.

The prompt is now on the middle but when the value changes it goes back to the left. What should I do? 


BTW. You can change the value either you type it or press the up or down arrow to change value. 

Thank you. :D

mvp_badge
MVP

Hi Jakerson,

The term placeholder is a bit misleading. If I understood correctly, it's the input text value you want to align at the centre. If that is the req, you have to include the text-align-center predefined class in the input Style Classes field as shown below.

Suppose you also want to include the input placeholder under this style rule. Then, you will also have to include the solution suggested by Rahul with a slight change, i.e. instead of using the number type input selector, I would recommend chaining the placeholder pseudo-element selector with a custom style class.

.input-placeholder-center::placeholder {  
  text-align: center; 
}

I hope this helps you!


Kind regards,

Benjith Sam

Hi @Rahul Kumar, I have another question.

The prompt is now on the middle but when the value changes it goes back to the left. What should I do? 


BTW. You can change the value either you type it or press the up or down arrow to change value. 

Thank you. :D

Champion
Solution

Hi  Jakerson Bermudo,


Add  below css at your screen. this will make placeholder in middle .

::placeholder {  
  text-align: center; 
}


For particular input you can use CSS selector. 

input[id^="Input_Num"]::placeholder {  
  text-align: center; 
}


Please check attached oml.

Regards,

Rahul

Lab_PH-2.oml

Hi @Rahul Kumar, I have another question.

The prompt is now on the middle but when the value changes it goes back to the left. What should I do? 


BTW. You can change the value either you type it or press the up or down arrow to change value. 

Thank you. :D

mvp_badge
MVP

Hi Jakerson,

The term placeholder is a bit misleading. If I understood correctly, it's the input text value you want to align at the centre. If that is the req, you have to include the text-align-center predefined class in the input Style Classes field as shown below.

Suppose you also want to include the input placeholder under this style rule. Then, you will also have to include the solution suggested by Rahul with a slight change, i.e. instead of using the number type input selector, I would recommend chaining the placeholder pseudo-element selector with a custom style class.

.input-placeholder-center::placeholder {  
  text-align: center; 
}

I hope this helps you!


Kind regards,

Benjith Sam

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.