Position labels above contact form inputs and add placeholder text

Store Design
1

Hi, in my contact form I am looking to add placeholder text which disappears upon clicking the box. Please see images.

AllOut_1-1660230841608.png
AllOut_1-1660230841608.png1022×431 5.15 KB

AllOut_0-1660233835444.png
AllOut_0-1660233835444.png913×497 8.02 KB

Any help would be greatly appreciated, thanks!

2

Hi @AllOut ,

Go to Assets > base.css and paste this at the bottom of the file:

.field__input:focus {
    padding: 1.5rem !important;
}
.field__input::placeholder {
    opacity: 1 !important;
}

Hope it helps!

1 Like
3

That’s perfect! Thank you so much!

1 Like