Skip Navigation

[Resolved] Adjusting the height of form fields

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Kolkata (GMT+05:30)

This topic contains 4 replies, has 2 voices.

Last updated by Minesh 2 months, 2 weeks ago.

Assisted by: Minesh.

Author
Posts
#2769914
462547442_553954730499411_4322865263289043946_n.jpg

Tell us what you are trying to do. The form fields are too narrow in height for people to type in, especially on mobile. How can I adjust the height of the fields?

Is there any documentation that you are following? Haven't found anything

Is there a similar example that we can see? See attached

What is the link to your site? hidden link

#2769965

Minesh
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Hello. Thank you for contacting the Toolset support.

You will have to add media query CSS per device resolution targeting your form fields.

Please check the following related ticket - you will have to add such custom media query CSS for the desired device resolution.
- https://toolset.com/es/forums/topic/cred-upload-buttons-in-mobile-look/

#2770024

Sorry, nothing I try is working. Do you have the CSS that I can use?

Thank you.

#2770030

Minesh
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Can you please share problem URL and admin access details.

*** Please make a FULL BACKUP of your database and website.***
I would also eventually need to request temporary access (WP-Admin and FTP) to your site. Preferably to a test site where the problem has been replicated if possible in order to be of better help and check if some configurations might need to be changed.

I have set the next reply to private which means only you and I have access to it.

#2770190

Minesh
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

You can use the media query break points in order to add your custom CSS based on your choice per device resolution:
=> hidden link

For now, I've added the following CSS code for mobile to your form's CSS Editor:
=> hidden link

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
  div.row input[type="text"] {
    margin-bottom:20px;
    height:35px;
  }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
   
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {

}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {

}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {

}

Can you please confirm you see input text box with bit bigger size on mobile device.

#2777237

Thank you, this working much better. Much appreciated.