Best way to control the width of search form inputs

This thread is resolved. Here is a description of the problem and solution.

Problem: I would like to know the best way to apply a custom width to a search form input field.

Solution: You can add custom CSS in the Filter Editor CSS panel like this:

input[name="toolset-maps-distance-center"]
{
 width: 40px;
}

This support ticket is created 6 years, 7 months ago. There's a good chance that you are reading advice that it now obsolete.

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
8:00 – 12:00	8:00 – 12:00	8:00 – 12:00	8:00 – 12:00	8:00 – 12:00	-	-
13:00 – 17:00	13:00 – 17:00	13:00 – 17:00	13:00 – 17:00	13:00 – 17:00	-	-

Supporter timezone: America/New_York (GMT-04:00)

Tagged: Custom search, Views plugin

This topic contains 1 reply, has 2 voices.

Last updated by Christian Cox 6 years, 7 months ago.

Assisted by: Christian Cox.

Author

Posts

April 7, 2018 at 6:45 pm #635728

Edward Barker

Hi There,

I'm trying to manually adjust the widths of inputs in one of my search forms.

Is it possible to change the width of the 'Enter a Location' field from the Toolset Maps search and if so how?

Regards

April 8, 2018 at 2:32 pm #636733

Christian Cox

Hi, usually you can control these search inputs with custom CSS. In the View editor screen, you can find a CSS panel just beneath the Filter Editor panel. Then you can add code that resizes your input field like this:

input[name="toolset-maps-distance-center"]
{
 width: 40px;
}

If this doesn't work for you, please tell me where on your site I can find this search form and I will check it out to make some recommendations.