Text in paragraph field overlapping [RESOLVED]

Grateful for any ideas. In my paragraph fields the text has started to overlap. The second row of text starts about half a row below the first as per below.

To fix the issue, the line height of the text should be increased. You can try using the following code, but make sure to add the correct CSS selector:

.CSSClass {
  line-height: 1.5em !important;
}

If you are unable to make it work, please share the exact page URL so that I can help you resolve the issue.

Thanks, that hasn’t worked, unfortunately. You can see an example at https://helpwildlife.co.uk/advice/baby-birds-of-prey/. If you click ‘i have some feedback about this article’ then it will show you a paragraph text box where you’ll see this issue. The grey box around the field is new and unintentional as well :confused:

To resolve the issue, try the following CSS in Appearance > Customize > Additional CSS. Then, the output will look like the following screenshot. :point_down:

#gform_18 textarea#input_18_3 {
  line-height: 1.5em !important;
}

Give it a try and let me know how that goes! :smile:

Thank you so much, that works for that field in that form. Is there an easy way to make this apply to all fields of this type in all forms or do I need to duplicate the CSS for each one?

Sure, please try the following modified code to apply it to all Gravity Forms forms that have a text area. This way, you won’t have to duplicate the code for different Gravity Forms IDs.

[id^="gform_"] textarea.textarea {
  line-height: 1.5em !important;
}

Give it a try, and let me know how that goes! :smile:

2 Likes

That worked perfectly! Thank you SO much, your help is very much appreciated :slight_smile:

1 Like