[Resolved] Multi line placeholder in CF7 text area

[Max]

Hey Tom and Co

I have an issue that I do hope you can help resolve.

I have created a multi column form using CF7 and GPs inherent grid.

Every thing works just fine accept for the following issue.

I have included a multi line placeholder text area as follows:

[textarea textarea-202 placeholder] 

* Please provide the details of your project
                                 
You can also attach a copy of your project scope
              
We will contact you if we require additional information

[/textarea]

As per CF7 documentation located here:

https://contactform7.com/text-fields/

Everything works perfectly when viewed in Chrome.

But when viewed in Firefox, the line breaks are stripped out of the placeholder text.

I have found a number of articles on this issue. However I have had no success implementing any one of them:
https://cat-in-136.github.io/2010/06/html5-textarea-placeholder-attribute.html
https://stackoverflow.com/questions/7189223/can-you-have-multiline-html5-placeholder-text-in-a-textarea
https://hashnode.com/post/how-to-insert-line-break-in-placeholder-html5-cirkbxfqn0dvktm5364eoeomh
https://bendechrai.com/2013/04/03/textarea-placeholder-with-new-lines/

Due to the design constraints of the form, it is crucial that I can use a multi line placeholder in the textarea…and that it works accross (all/most) browsers not just Chrome.

Thanks in advance for any help you can provide.

Kind Regards

Max

[Tom]

It looks like it’s up to the browser to respect the returns or not. You can double check with the Contact Form 7 developer, but I’m not sure if it’s possible unless you use javascript (maybe).

[Author]

Posts