I've read the forums, I understand you can apply CSS styling via at Additional Attributes area but I'm just too css illiterate to figure it.

Essentially I'd like to put multiple fields on one line using tableless xhtml.

such as:
<li>
<div class="formCaption">{FirstName:caption}</div>
<div class="formBody">{FirstName:body}</div>
<div class="formCaption">{LastName:caption}</div>
<div class="formBody">{LastName:body}</div>
</li>

When this executes, the Last Name caption butts up against firstname field. Not a problem, I can add some spaces using a few &NPSP's- probably incorrect as well but I can't break out of my table instincts.... I presume though css padding or similar this could be handled.

However the LastName Field is too far to the right of the LastName caption. Appears the fields CSS are set to X position from a caption.

Although that looks ok if fields are all on one line, it's not too pretty when adding multiple fields to one line- like birthday fields year, month, day with no caption - lost of spacing between fields.

So I presume there is a way to modify the css through the additional attributes, at a field level, to control the spacing of certain fields like Last Name etc.

Any help you could provide would be appreciated!

Hello,

You can use something like this:

<li>
<div class="formCaption">{FirstName:caption}</div>
<div class="formBody" style="margin-left: 10px;">{FirstName:body}</div>
<div class="formCaption">{LastName:caption}</div>
<div class="formBody">{LastName:body}</div>
</li>

Regards