Nintex Workflow - Use Build String to create HTML

Well, the "easiest" solution would be to add the css in the form or the list view, instead of including the css reference in the content. This way you also include the css only once and not for every item.

So you could add a content editor webpart to the list view as well as to the display-form/edit-form to include the css.

LINK

This element defines a link. Unlike A, it may only appear in the HEAD section of a document

see Links in HTML documents

Hmmm, wouldn't that require me to go in and add the css in every list view that I have with this list? And furthermore if my users wanted to create a new view - for example to do some filtering or change of which columns to show - they would lose the styling?

Is there a way to include the styling in every view - including future ones?

I tried to write the styling as inline in stead of linking to an external file (which is not really my dream scenario but ok, just to try).

To keep things simple for this investigation, I just put this in the Build String action:

<style>table {background-color: red;}</style>

This did not give me red tables... When looking at the html code that is generated I can see that something more is added (by Nintex? or by Sharepoint itself?):

This "magic number" makes it so my styling of tables is not rendering. I copied the above snippet to a text file, and when I removed the "magic number", the table suddenly appears with red background.

Where does this number come from? Can I get rid of it, or in some other manner get the browser to render my styling despite this number being there?

Good question.

Why don't you add a custom class to your table and add the styles using a content editor webpart to the page?

One of the things I've noticed while adding any kind of style in a nintex-workflow using 'build string' is that either SharePoint or Nintex adds line breakers directly in the html code.

The best way to avoid that is to remove all line breakers in the code inside the 'build string' command. I'm guessing this could help you too.

so for instance (not use how html code will react in this box...)

<style>

     table{ something:1px;}

</style>

This will render incorrectly, always

instead <style> table{ something: 1px;}</style>

will react exactly as foreseen.

‌ did you come to a conclusion on this? You will definitely run into the sharepoint display templates that will remove html it doesn't like. It may be easier to simply add classes to the html and not include any style tags in the field's value. But instead change the display template or JSLink for the list view so as to include your custom CSS file.

I've found this to be true as well in my past tinkering.