Hi @graphicdop ,
I hope you’re doing well.
I understand that you added those .hour and .minute classes to the fields, correct? This can be done by editing the Field under the Styling tab – https://wpmudev.com/docs/wpmu-dev-plugins/forminator/#additional-css-classes
That being said, note that we can’t provide you with custom CSS as that’s out of our support scope but we can recommend on what could be happening.
In this case, note that you need to use the correct selectors as the additional class is added to the field itself, but you need to move only the input, which is a child of the element itself. Here is also more info about CSS selectors – https://www.w3schools.com/css/css_combinators.asp
That being said, a quick solution would be to move the field description below the input with this setting under Appearance > Layout and Spacing > Layout > Field description position:
https://snipboard.io/4ALtDu.jpg
I hope this helps.
Best Regards,
Williams Valerio
Hello, Williams! Thank you for your reply, but no, you misundrstood me.
- I only want to put “Number’ fields side-by-side in one line, the same as “Phone” and “email”. Phone and email are looking great, but “Number” fields are broken. Please see screenshot; https://www.dropbox.com/scl/fi/booizfxzgapeil4vzw93r/Broken.png?rlkey=6slwxeabqipm3u43q8uf958r8&dl=0 and this one is in the form editor: https://www.dropbox.com/scl/fi/8q9z1finrx6m5tbdfsvkm/Editor-view.png?rlkey=dmrkl5eiaxo9kvofy3eu0gfij&dl=0
- I do not ask you to code for me, I said that I tried to fix the layout issue with CSS, but it did not work.
- I know how to style Forminator forms, and I followeed documentation. All I needed to do is drag the field and drop it next to the one I want to place it with, side-by-side. But “Number” fields appears broken. please, see screenshot again: https://www.dropbox.com/scl/fi/booizfxzgapeil4vzw93r/Broken.png?rlkey=6slwxeabqipm3u43q8uf958r8&dl=0
Thank you,
Regards,
Olga
Hi @graphicdop ,
I hope you’re doing well.
This happens because the Hour number field has a description; as you can see, it appears on top of the input and moves it down.
If you check the other correctly inline fields don’t have a description at all.
Could you please confirm if using this option under the form appearance helps? https://snipboard.io/4ALtDu.jpg
You can also use CSS, but you will need to point to the input, not the complete field.
I hope this helps.
Best Regards,
Williams Valerio
Hi @graphicdop,
Since we haven’t heard from you for a while. I’ll mark this thread as resolved for now. Please feel free to re-open this thread if you need any further assistance.
Best Regards,
Nithin
Hello, Williams! Apologies for the delay with my response; my email was broken, and I did not receive notifications. My client said that she did not need minutes, so I just removed these fields, and the problem was solved. However, thank you very much for your help and suggestions; we can close this topic now, but perhaps someone else can benefit from your replies and solution.
With Kindest Regards,
Olga