Placeholder Text for a Dropdown Menu & Form Styling Question

Is there a way to add placeholder text to a drop down menu?

My current form has placeholder text for the form labels, I would like to do that same for the dropdown menu with the text How Did You Hear About Us?

Also, keeping the form in the same width, how can I get all form fields to be on the same form line?

Hi there,

Please see below for the responses.

My current form has placeholder text for the form labels, I would like to do that same for the dropdown menu with the text How Did You Hear About Us?

- You can achieve this by going to Dropdown field's Properties > Options and enabling/providing Show Text in Empty Option. Please see steps below.

Also, keeping the form in the same width, how can I get all form fields to be on the same form line?

- I am afraid you will have to decrease the width of each of your fields as well. Please inject the following CSS to your form.

.form-line {

width: 19% !important;

}

If you need further assistance, please let us know.

Regards.

thank you-

how can i change the font size and color of the placeholder text for the dropdown menu?

Also, is there a way to style the hover text box that appears when you hover over montgomery or prattville? the hover box is currently far to the right and hard to read. I would like the hover text box to be above or below the circle options

Hi,

Please go to Advanced Designer by clicking "Design" on the form builder. Click the dropdown field and choose the text color you'd like. Please see:

To change the position of the hover text click the CSS tab and hover around the radio buttons to make the hover text visible. Then click on the text to declare it as a CSS selector. When you do this, you can give margin attribute to change its position. Please see:

Please let us know if you encounter any issues.

Thank you for contacting us. 

i cant move the hover text box. Can you give me the css code to move this?

If you want to move hover text of radio button field closer to that field add this CSS code to your form:

#id_23 div.form-description {

    right : -80px!important;

}

How to Inject Custom CSS Codes

Here is my demo form: https://form.jotform.com/70244496071960 

Feel free to clone it.

Hope this will help. Let us know if you need further assistance. 

great.

I have moved your last question to separate thread and we will provide you an answer there shortly. 

https://www.jotform.com/answers/1046261 

i added the css back to my form and it still isn't working. I also looked at your demo form and see the same issue:

You probably wanted to post your reply in your other thread https://www.jotform.com/answers/1046261, so I will provide you an answer there.