Autocompleted Address widget: Customize field size to be the same as other fields

filelds size should be same as above

Hi Zahid,

You can easily customize the fields in the Autocompleted Address widget to match the style of the other fields on your form. Let me show you how:

1. First, copy the code below.

/*thread 26534301*/

.grid > div > input, .address-input > input { height: 33px !important; }

.address-input { padding: 0; }

#results { width: 100%; }

.grid > div { padding: 5px 0; }

.grid > div:nth-child(odd) { padding-right: 5px; }

/*ends here*/

2. In Form Builder, click on the Autocompleted Address widget to select it.

3. Next, click on the wand icon to open the widget's settings.

4. Click on the Custom CSS tab, then paste the code you just copied to the CSS code box.

5. Click on Update at the bottom of the page, and you're done.

You also need to add a custom CSS code into the form. Let me walk you through it:

1. First, copy this code:

/*thread 26534301*/

iframe#customFieldFrame_23 {

    width: 428px !important;

    max-width: 428px !important;

}

/*ends here*/

2. In Form Builder, click on the Paint Roller icon on the right side of the page to open Form Designer.

3. Now, in the Form Designer menu, click on the Styles tab, scroll down and paste the code into the Inject CSS Code box. That’s it. The code is automatically saved.

Give it a try and let us know how it goes.