I'm trying to add a placeholder to a textarea in the forms in my reactjs project. The placeholder is multiline and looks like this
<textarea
{...this.props}
ref={textarea => {
this.textarea = textarea;
}}
placeholder={'Address Line1\nAddress Line\nCity State, Zip\nCountry'}
/>
on chrome, the text holder is rendered as multiline properly. on firefox it's just a single line even if the text is there and on safari, the placeholder text is rendered as one line only
i've been going through different stackoverflow posts
- how to line break on placholder of text area
- How to add multi line place holder text in textarea?
- Can you have multiline HTML5 placeholder text in a <textarea>?
and from what i could tell, while this wasn't allowed before, it's part of the spec now and it should work.
Has anyone gotten this to work on different browsers?
UPDATE (Nov 16): I added a "rows" attribute to the placeholder and the lines were displayed. still didn't work for safari
