Chronoform gestire lunghezza campi bypassando gli stili del template [RISOLTO]

[frera]

Salve a tutti ho un piccolo problema e vorrei chiedere a voi se avete suggerimenti in merito, ringrazio intanto tutta la comunity che mi ha consentito attraverso gli articoli e i post nel forum di trovare sempre una soluzione, ed un grazie particolare a Vales per le sue guide.
Il problema ritengo sia piuttosto semplice in pratica ho la necessita di avere un campo piu lungo rispetto agli altri, benchè setti la lunghezza del text box "Field Max Length" lui si adegua agli stili del template. Giocando un po con firebug con la speranza di trovare il modo di farlo, mi sono accorto che se modifico la lunghezza nel css del template ovviamente tutti i campi assumono quella lunghezza, ragionando un po sono arrivato alla conclusione (spero giusta) che avrei bisogno di un css mirato all interno del form quindi utilizzando "load css" da inserire per primo in on load.
Quindi se ho 10 campi field_1 field_2 ecc e voglio che field 1 sia di 300px quale sarebbe il codice da inserire su load css? ed il mio ragionamento è giusto per bypassare gli stili del template?
Premetto che non sono pratico di codici e sicuramente non ho le vostre competenze ( sono infermiere )

[frera]

continuando a ragionare load css per dirla pulita.... non c'entra una ceppa...
devo agire sul parametro size="xxx" ma dove inserirlo e come?
Un aiutino?

[frera]

forse sbaglio proprio sistema di ragionamento? nessuna sa darmi un suggerimento, un consiglio?

[xplosion]

Quando sei in Form Wizzard, accanto al campo da personalizzare lo stile, clicca sul pulsante "Configure". Nella prima scheda (General) trovi un campo "Field Class".
Definisci una tua classe pippo e poi crei nel css un'istruzione del tipo:

Codice: [Seleziona]

input.pippo{width:350px;}

[frera]

Grazie Xplosion mi hai dato una traccia ed ho risolto
Descrivo come ho risolto nel caso qualcuno avesse bisogno
Grazie a firebug di firefox ho scandagliato i file css che regolavano i campi ed ovviamente li pescava dai css del template, controllando i css di chronoform /components/com_chronoforms/css ho potuto notare la presenza di frontforms_tight.css e mi si è accesa la lampadina
ho impostato sul form setting Tight Layout=Tight e ricontrollato con firebug adesso il css utilizzato era proprio frontforms_tight.css andando a guardare il file ho trovato alla riga 64 il seguente codice

Codice: [Seleziona]

/* input sizes */
.small_input { width: 200px !important;}
.medium_input { width: 350px !important; }
.big_input, .title_input { width:475px !important; }
.title_input { padding: 8px 5px; font-size: 18px; margin-bottom: 15px; float: left !important;}
Quindi ricontrollando i file css utilizzati mi son reso conto che se non inserivo tight, il file css che entrava in gioco era frontforms.css
ecco che grazie alla soluzione di  Xplosion mi rendevo conto che non avevo la necessità di creare la funzione in quanto era gia presente!!

Quando sei in Form Wizzard, accanto al campo da personalizzare lo stile, clicca sul pulsante "Configure". Nella prima scheda (General) trovi un campo "Field Class".
Definisci una tua classe pippo e poi crei nel css un'istruzione del tipo:

Codice: [Seleziona]

input.pippo{width:350px;}

Ho inserito in field class del campo interessato medium_input ho salvato ed il campo si è allungato 
Quindi e possibile inserire in filed class senza necessariamente impostare sul form setting Tight Layout=Tight,  in quanto il codice e presente anche su frontforms.css
I valori inseribili sono:
small_input = 200px
medium_input = 350px
big_input o title_input = 475px
ovviamente e possibile editare le lunghezze
Grazie Xplosion !!