Umbraco Forms Columns
# help-with-umbraco
c
V13.6.0 UF13.4.0 In a site that is totally Tailwindcss I've been given a form that needs to be in two columns. Under the hood the HTML in the forms template is
<div class="umbraco-forms-container @("col-md-" + c.Width)">
which of course means nothing without bootstrap or other framework that responds to col-md-6. I changed it to
<div class="umbraco-forms-container @("col-md-" + c.Width)" style="max-width: 40%">
but it's still all in one column. Any ideas how to acheive 2 columns without having to install bootstrap. Tailwind won't be any use here has it has to be in the view at build time. I have the forms.cshtml in a Theme folder which has been chosen by the editor when they put the form in an RTE with the usual macro. Thanks.
r
If you're using tailwindcss v3 (or lower), there's a safelist of classes you can add to the config that will always be included in the output: https://v3.tailwindcss.com/docs/content-configuration#safelisting-classes v4 removed this option though sadly
Looks like you can get around the change in v4 by adding the safelisted classes to their own .txt file and specifying it as a
@source
c
Ooh, that sounds good. Thanks, I'll give it a try. 🙂
15 Views