Request Offering prompt realignment

Aaron_Boock

I currently have four text prompts.  I'd like to set each prompt to a width of 25% and align them all in the same row on the page.  I do not want to add html code to the prompt names to do this.  Has anyone already done this or similar?  Any guidance to steer me in the right direction?

Geoff_Ross

Hi @Aaron_Boock

I just did something similar. I made a data picker half the width rather than one third. This is the line of JS I used which might just about kick you off

$('.col-md-4').find('input[data-control="dateTimePicker"]').parent().parent().parent().parent().removeClass( "col-md-4" ).addClass( "col-md-6" );

Geoff

Aaron_Boock

Thanks Geoff, i used your guidance to remove the existing col classes and then apply my own css classes.

Then i applied the following to those classes:

display: inline-block;

position: relative;

padding-right: 60px;

line-height: 1.5;

The left-most prompt got its own setting: padding-left:30px;

Thank you for your input - I'm very pleased with how good it looks

Geoff_Ross

Hi @Aaron_Boock

I just did something similar. I made a data picker half the width rather than one third. This is the line of JS I used which might just about kick you off

$('.col-md-4').find('input[data-control="dateTimePicker"]').parent().parent().parent().parent().removeClass( "col-md-4" ).addClass( "col-md-6" );

Geoff

Aaron_Boock

Thanks Geoff, i used your guidance to remove the existing col classes and then apply my own css classes.

Then i applied the following to those classes:

display: inline-block;

position: relative;

padding-right: 60px;

line-height: 1.5;

The left-most prompt got its own setting: padding-left:30px;

Thank you for your input - I'm very pleased with how good it looks

Geoff_Ross

@Aaron_Boock
Awesome. Can we get a cheeky screenshot?

Aaron_Boock

I decided to add a T/F checkbox to allow multiple entries