Can you help me make my page tabs look better?

Do you have any suggestions as to how I can make the page tabs on my form look better?

It looks clunky. I just want to make it easy for those who fill out my form to be able to complete it easily and I'm not sure the way these tabs are displayed assists?

Any ideas?

Please try injecting the following CSS code:

.tabs-list.mikadoyellow li {

    padding: 3px 30px;

}

Example:

Result:

Let us know if you need more help.

That's great! Is there any way you can change the highlight colour from yellow to blue HEX #3e78bc ?

Thank you!!

Please add the following css code to the tab's widget custom css as shown in the screenshot below :

.tabs-list.mikadoyellow .current {

    background: #3e78bc !important;

}

Following your help above, I added a second blue and probably some other CSS on the "Form Designer" (?)

and now my form tabs are back to being on 3 lines instead of 2.

Can you plook at my code and try to help me understand why this is happening?

Hello,

I have cloned your form into my side and checked CSS codes.

Please inject below CSS into your form:

.tabs-list.mikadoyellow li {

    padding: 3px 30px;

    margin: 1px 0px -1px 0px;

    color: #fff;

    background: #3e78bc;

}

.tabs-list.mikadoyellow .current {

    background: #35669f !important;

}

There were some duplicated CSS codes and I removed them and modified CSS codes. 

After you update the widget, your form will be seen like below:

Demo Form: https://form.jotform.com/70864021408956

You can clone this form into your side: How-to-Clone-an-Existing-Form-from-a-URL?

Please follow the guide: How-to-Inject-Custom-CSS-Codes?

If you need any other supports, please feel free to let us know.

Thank you.

Hi, I followed the above and it still isn't formatted correctly.

What am I doing wrong? :(

https://form.jotform.co/70867833544870 

I still could not replicate the issue at my end.

This is the screenshot of what I see at my end. 

Please refresh the Browser cache http://www.refreshyourcache.com/en/home/ and try again.

If you continue facing the issue, let us know what browser are you using.

You are right! I cleared the browser cache and now it is perfect :)

thank you!

We are happy to hear that your issue was resolved.

If you need any further assistance, please don't hesitate to contact us.

Thank you.