Keeping Table Right Justified Upon Submission

replied on July 20, 2018

What is the CSS you are using to right justify the text? I've found that some things use different HTML elements when Forms is rendering the final version, which is why CSS that works in the browser sometimes doesn't seem to work on the saved copy.

0 0

View 4 previous replies

replied on July 20, 2018

Interesting, CSS below.

.myTable input {text-align:right;}

0 0

replied on July 20, 2018

Try something like this

.myTable tr > * {
    text-align:right !important;
}

I believe with tables they only have input elements when shown in the browser, when the form is rendered the input elements are not present.

I've seen similar behavior on some of my forms, so you just want to use/add a selector that will cover any text in the table cells.

You'll probably need to get creative with selectors if you need to exclude row labels and such, but the general idea is that you need to account for table content that doesn't have an "input" element in the final version.

0 0

replied on July 20, 2018

To add to the above, the inputs turn to divs when printed.

0 0

replied on July 20, 2018

Thank you both - I will give your suggestions a try!

0 0

replied on July 20, 2018

I tried the CSS suggested and it resulted in all table labels getting right aligned, but not the text. How would I target just the inputs, but not the labels?

Thanks in advance!

0 0

replied on July 20, 2018

Try adding a :not() selector to exclude label elements

.myTable tr > *:not(label) {
    text-align:right !important;
}

0 0

replied on July 20, 2018

You can also try something like the below, where Field21 should be replaced by whichever field number your table contains.

.cf-field > [id^=Field21]  {text-align:right!important;}

0 0

Question

Question

Keeping Table Right Justified Upon Submission

Replies

Sign in to reply to this post.