Maybe you would also need a column "instructions", where you could put something like "add 'btnManager' to css-class attribute in control" or "create panel and inside create lables and add css-class to panel".
Yep! Definitely 
there will be an instructions section at the front - good call.
For now, just need contributions.. and no one has stepped up yet!
Hey Rhia,
Here is a minimalist design for Nintex Forms Desktop:
White-Green CSS
Greetings,
Pieter
Thank you! Great start 
That's a good idea !
What do you think about users are asking for help regarding CSS and we help them and this way it's easier for you to get content !
I can do lot of things with CSS but I'm not a designer and I need a beautiful image/example that I then will be able to reproduce using CSS.
What do you think about that ?
Definitely
i plan on going through the community and then pulling out CSS from helpful posts, as well
and then, of course, I have questions about things I've seen that I'd like to have CSS for -- and I'll post those as well
This thread will see life soon .. just haven't quite had time yet !
Applying a different font via CSS:
@import url(//fonts.googleapis.com/css?family=Fredericka+the+Great);
.fredericka{
font-family: 'Fredericka the Great';
}
The bolded bits can be any font from the Google catalogue.
Did not realize how easy this was. Definitely going into the catalogue.
Here's a bit of CSS that I've used for creating a floating validation error message box. (Credit: inspired by / stolen from arno at https://community.nintex.com/thread/2447.)
Screenshot:
CSS:
#onetIDListForm{
margin: 0 auto;
}
@keyframes fadeIn {
from {opacity: 0;}
to {opacity: 1;}
}
.nf-validation-summary{
position: fixed;
top: 150px;
width: 280px;
left: 15px;
background-color: white;
border: 2px solid red;
border-radius:10px;
animation: fadeIn 1s;
z-index:9;
}
Ooh, and here's another one: this takes away the header row and checkboxes from List View controls.
tr.ms-viewheader, tr.ms-vhltr, tr.ms-vh-icon, td.ms-vb, td.ms-addnew, td.ms-vb-firstCell{
visibility: collapse;
}
I'm intrigued .. can you post a screenshot of a before & after?
I applied this to one of my forms but nothing happened that I noticed... not sure what I was looking for though!
For sure. Here are some screenshots:
Without CSS:
With CSS (note that the "+ Add document" link is also gone):
Resize Multi Select Box.
.nf-lookup-addremove button{Width:60px !Important}
.nf-lookup-addremove select{Width:230px !Important}
Before...
After...
Note, change doesn't show on design view.
Reduce space around fields....
This is amending the default CSS on a form. I've made this change and then exported and uploaded it as a default template so all forms are set to this. Also my grid is set to 5 x 5 for smaller adjustments. Nothing stopping you adding this to your base css either.
CSS changed from 10 to 5.
Before...
After
thank you for your contributions! I'll be working on this as soon as I get some time ^^
Hi,
to Change
- background-Color
- hide Sidenavigation
- resize siteicon
Put this code into a ScriptEditor on your Page:
<style>
.ms-core-overlay { background-color: transparent; }
body #s4-workspace { background-color: #FFFFFF; }
.ms-siteicon-img { top: 0px; left: 15px; max-width: none; max-height: none; width: 169px; height: 80px; float: left;}
#sideNavBox{ display:none !important; }
#contentBox{ margin-left: 20px !important; }
</style>
Before:
After:
Sometimes you just want to center a form on a page.
Before:
After:
Needed CSS:
table#onetIDListForm { width: 100%; }
If you really want to make sure, you're styling the right table, you might want to use JavaScript instead:
NWF$(function() {
NWF$("table#onetIDListForm:has(div.nf-non-dialog-outer)").css("width", "100%");
});
The same with Forms:
#sideNavBox{ display:none !important; }
#contentBox{ margin-left: 20px !important; }
body #s4-workspace { background-color: #FFFFFF; }
Hi Henning,
there is a "shortcut". Just use:
#onetIDListForm{
margin: 0 auto;
}
Another one:
Hide Ribbonrow in Forms. Not really CSS but also useful 
Enter this into Custom JavaScript:
NWF$("#s4-ribbonrow").hide();
Before:
After:
This is amazing you guys, keep it coming! I'll have a lot of time in April to start putting this catalogue together. I promise, it's coming!
Great idea . Definitely Bookmarking this.
Along these lines, I've also added this line. It will then move the form up so there isn't such a gap from top of page to form. You could just place in your CSS as listed below the jQuery. The jQuery simply ensures that it is added after CSS is loaded.
NWF$('#formFillerContainer').css('top', '40px');
OR
#formFillerContainer {
top: 40px !important;
}
Rhia Wieclawek – I love the idea! I've done some font-awesome CSS integration with Nintex Forms that I can contribute, although it may be a little more involved given the dependancies.
.... 
