Why aren't my placeholders appearing despite correct coding?

[Sten21]

According to everything I have done, my placeholder should appear, however, it doesnt. Cant find anything wrong in the code though.

[tim · Accepted solution]

There is a rule in base.css which makes field input placeholders transparent.

You should try adding this to the "Custom CSS"  section setting:

.field__input::placeholder {
  opacity: initial;
}

[niraj_patel]

Hello @Sten21 
Can you share store URL?

[Sten21]

https://fdee8b-2.myshopify.com/products/namnskylt-i-unik-typsnitt?variant=45098704568587

pw: eawhak

[Hardik29418]

Hello,

Welcome to the Shopify Community.
I read your problem and it seems that I need to analyze your website to provide the solution here.
Would you please share your website URL and if your website is password protected then also provide the password.

[Sten21]

https://fdee8b-2.myshopify.com/products/namnskylt-i-unik-typsnitt?variant=45098704568587

pw:eawhak

[tim · Accepted solution]

There is a rule in base.css which makes field input placeholders transparent.

You should try adding this to the "Custom CSS"  section setting:

.field__input::placeholder {
  opacity: initial;
}

[Sten21]

This worked! Thanks

[websensepro · Accepted solution]

Hi @Sten21 ,

Replace this code

<input class="field__input font-preview__input" form="product-form-template--19010366800139__main" type="text" id="your-label" name="properties[Namn att printa]" placeholder="Skriv din text här" style="padding: 10px; margin-bottom: 10px; font-size: 18px; border: 2px solid #ccc; border-radius: 5px; width: 100%;" maxlength="5" required="">

This correct code

<input form="product-form-template--19010366800139__main" type="text" id="your-label" name="properties[Namn att printa]" placeholder="Skriv din text här" style="padding: 10px; margin-bottom: 10px; font-size: 18px; border: 2px solid #ccc; border-radius: 5px; width: 100%;" maxlength="5" required="">

Thanks!

[Sten21]

Many thanks!