Question T16606
Visible to All Users

Birth date questions formatting

created a year ago

I'm trying to create a birth date set of questions consisting of a month drop-down, followed by a 2-digit day text field, followed by a 4-digit year text field. (See attached survey json.)

I set the startWithNewLine to false for the month and year questions so everything will all be on the same line, which seems to work.

However, setting the size for the day and year questions to 2 and 4 respectively doesn't seem to work as expected. The field lengths seem to be correct, but they are each inside of a box that's taking up 1/3 of the screen width. What is the recommended way to achieve my desired outcome? (See attached desired and actual screenshots.)

Answers approved by surveyjs Support

created a year ago

Hi Mary,
Thank you for sharing these illustrations. You can achieve this output by using a combination of survey element settings and a custom theme. Consider the following demo: View CodeSandbox. In this example, I configured survey layout settings to produce the desired output. Additionally, I customized a survey theme and decreased the 'scale' theme parameter to make a form appear in a more compact way.

To simplify the resultant survey JSON definition, you can register a custom Birthday component: View Demo.

Let us know if you have any further questions.

    Comments (2)

      Perfect. Thank you!

        You are always welcome! Please feel free to contact us if you have further questions.