Is there a way to pad the left margin of form with space, basically an indentation of the fields by whatever # pixels I specify?

  • 0
  • 1
  • Question
  • Updated 3 years ago
  • Answered
Photo of Ben

Ben

  • 0 Points

Posted 3 years ago

  • 0
  • 1
Photo of Ⲇanom the ultimate (Dan Diebolt)

Ⲇanom the ultimate (Dan Diebolt), Champion

  • 30,044 Points 20k badge 2x thumb
Use IOL with this essential code:

$("#formContentsContainer").css("padding-left", "60px");

Photo of Ben

Ben

  • 0 Points
I'm a little embarrassed to say this, but I don't know where to insert this code.  Can you elaborate on the IOL process or provide an article?  I only have dabbled in formulas a little but in QB.  Thanks
Photo of Ⲇanom the ultimate (Dan Diebolt)

Ⲇanom the ultimate (Dan Diebolt), Champion

  • 30,044 Points 20k badge 2x thumb
See the demo below:

Shift Form Right ~ Add New Record
https://haversineconsulting.quickbase.com/db/bk8f3thaq?a=nwr

Pastie Databsase
https://haversineconsulting.quickbase.com/db/bgcwm2m4g?a=dr&rid=520

Follow the links in the [Notes] field of the pastie for instructions on implementing the IOL technique.

For dramatic effect I shifted the form 400px right over 10 seconds. You can uncomment the line that immediately sets the padding and remove the animation.
Photo of Ben

Ben

  • 0 Points
That works!  My only question is I want to make only a certain section of fields indented.  Is there a way to make this only appear for a section or a <p> tag?
Photo of Ⲇanom the ultimate (Dan Diebolt)

Ⲇanom the ultimate (Dan Diebolt), Champion

  • 30,044 Points 20k badge 2x thumb
For a particular section:

$("#sect_s1").css("padding-left", "60px");
Photo of Ben

Ben

  • 0 Points
It doesn't work...does the section need to be titled "sect_s1"?
Photo of Ⲇanom the ultimate (Dan Diebolt)

Ⲇanom the ultimate (Dan Diebolt), Champion

  • 30,044 Points 20k badge 2x thumb
It works - I test just about everything first.

sect_s1 is the id attribute value for the section. Look at the HTML source for something like this:

<div><!--The div around the table is so that the toggling can be animated smoothly-->
<table id="sect_s1" class="formSection LabelsLeft">
Photo of Ben

Ben

  • 0 Points
Great that works perfectly.  Thanks so much!