CSS con differenti tag 'input'

[JANUS70]

Ciao ..
all'interno di un div ho varie caselle di tipo 'input' (text e submit) a cui devo assegnare un font (in px) per evitare che al variare del font del browser, il carattere cambi dimensione ..
Il problema è che le caselle 'text' e i pulsanti 'submit' (entrambi tag 'input') devono avere un font differente ..
A stò punto se attribuisco al 'div input' un determinato font, il font sarà lo stesso sia per i text che per i submit ..
Ho provato ad assegnare ai pulsanti un 'id' o una 'class' con un font diverso, ma quello del 'div input' assegnato nel foglio dei css prevale ..
L'unico modo che ho visto funzionare è quello di usare lo 'style' (con relativo font) nel codice del singolo tasto.
Il problema è che questa situazione è molto diffusa (praticamente su tutto il progetto), e diventa assurdo dover cambiare tutte le pagine del codice per cambiare il font dei tasti !
Come posso risolvere ?
Grazie

[FedericoC]

textarea {
font: 12px verdana !important;
}

submit {
font: 12px arial !important;
}


Anche se non mi piace utilizzarlo in questo caso ti consiglio di utilizzare !important


C'è sicuramente un altra via per risolvere la tua situazione, ma non conoscendo il codice questo è il metodo più sicuro

[JANUS70]

Originariamente inviato da FedericoC
textarea {
font: 12px verdana !important;
}

submit {
font: 12px arial !important;
}


Anche se non mi piace utilizzarlo in questo caso ti consiglio di utilizzare !important


C'è sicuramente un altra via per risolvere la tua situazione, ma non conoscendo il codice questo è il metodo più sicuro

Grazie mille ..
come funzionerebbe "!important" ?
.. e perchè non ti piace usarlo ?
Grazie

[FedericoC]

In pratica i CSS hanno una regola di priorità data dalla specificità del selettore (in poche parole più tag e classi specifici più la priorità è alta)...


!important rompe questa gerarchia e domina su tutti gli altri selettori, in pratica è un pò come specificare gli attributi inline nello style=""..


Proprio per questa "rottura" delle gerarchie preferisco inserire selettori più specifici prima di utilizzare !important

[JANUS70]

Ho provato a distinguere le caselle di testo dai tasti, usando nel foglio css, la distinzione suggeritami (textarea e submit) .. funziona perfettamente, anche senza la 'clausola' "!important".
Peccato che se vado a modificare il font del browser .. il font indicato nel css CAMBIA
Cosa che non avviene se il font nel css viene assegnato agli 'input' (senza specificare 'textarea' piuttosto che 'submit').
Assegnando il font agli 'input', per le caselle di testo, e specificando poi quello per i tatsi con 'submit', quest'ultimo non viene preso !
Spero di essermi spiegato bene

[nicuccia]

Io solitamente quando devo agire sui vari input.. che siano di tipo "text" o di tipo "submit" faccio in questo modo:

Prima di tutto mi creo un contenitore a cui assegnare una classe oppure un id specifico e all'interno inserisco il mio form.. E dopo inserisco le istruzioni per applicare lo stile a tutti gli input del contenitore di tipo text, submit oppure textarea.

#Contenitore { ... }

#Contenitore input[type="text"] { .......... }

#Contenitore input[type="submit"] { .......... }

#Contenitore textarea { .......... }