I’ve spent around three hours now in investigating how to make this clickable legal GDPR text within the WPForms smaller.
The exhaustive WPForms CSS documentation [1], [2] unfortunately doesn’t comment this use case and also doesn’t give any hint what tag needs to be edited. :-/
Investigating the source code also occurs, that element also references / relies at this point to some PhotoProofs CSS font settings. Thus I’ve tried to figure out by developers mode and click element feature. Noticed that the tags ...
/* Tag to make the WP Forms GDPR Disclaimer Text smaller */
.wpforms-container .wpforms-field-label-inline {
font-size: 10px;
}
/ * Tag to makes the text starting at left alignment * /
.wpforms-container ul,
.wpforms-container ul li {
margin: 0;
}
effects such text. However, changing the font size makes font smaller, but remains its prior line-height. Thus no space can be won. Adding line-height tag seems to have no effect. Whatever I coded here didn’t work.
I would be thankful, if you could let me know which tag needs to be changed in order to make the obligatory GDPR disclaimer text a little smaller, so that the legally sufficient text (which isn’t what WPForms thinks it is) doesn’t waste half of the screen.
Thanks very much for a hint.
[1]
https://wpforms.com/docs/how-to-customize-the-style-of-individual-form-fields/#global-selectors[2]
https://wpforms.com/docs/how-to-add-a-terms-of-service-checkbox-to-a-form/
Comments
Thought it's tricky. Looks brilliant with your Custom CSS settings.
I've put additionally ...
#wpforms-9009-field_3 {
margin-left: 0;
padding-left: 1.5em;
position: relative;
}
#wpforms-9009-field_3_1 {
position: absolute;
top: 0;
left: 0;
}
#wpforms-9009-field_3 .wpforms-field-label-inline {
font-size: 12px;
line-height: 15px;
display: block;
}
... for the German version of the contact page. Hopefully I've altered the code correct. At least it looks as it works. ;-)
Btw, this formatting looks much much better than the prior default version.
Many thanks!
With kind regards.