46 258
contributi
Differenze tra le versioni di "Aiuto:Manuale di stile/Avanzato"
Aiuto:Manuale di stile/Avanzato (visualizza wikitesto)
Versione delle 23:23, 3 dic 2019
, 23:23, 3 dic 2019→Tricks e workaround scoperti sul campo
|
* Se metti a tutti i figli di un certo elemento la class ''align-middle'' e questo elemento ha la stessa altezza del suo figlio più alto, l'effetto è quello di avere tutti i figli centrati verticalmente. Se per caso questo figlio non esistesse, si può provare ad aggiungere un elemento con "height: 100%;" e niente ''width'' e dargli ''align-middle''. In teoria ''vert-middle'' fa entrambe queste cose, ovvero aggiunge l'elemento con "height: 100%;" e mette a tutti i figli align-middle. Il problema di entrambe queste classi è che spesso "height: 100%;" non funziona.
* Se si vuole escludere una qualsiasi riga di un tabella dall'effetto del <code>white-rows</code> basta usare <code>!</code> invece della normale <code>|</code>. In questo modo la prima riga diventa l'header della tabella, una riga in mezzo rappresenta un divisorio e l'ultima il footer, che non vengono influenzati dalla classe.
* MediaWiki aggiunge del margin ai <code>p</code> di default. Questo non sarebbe un problema dato che nei template raramente si inserisce un <code>p</code>, ma il parser ha anche questa simpatica prerogativa di interpretare una riga di testo come appunto testo e quindi wrapparla automaticamente in un <code>p</code>. Questo può avvenire anche nei template perché una riga di testo può apparire molto facilmente:
** Se si usa <code>#if</code>/<code>#ifeq</code>/<code>#switch</code> è sufficiente inserirne la prima parte nella riga stessa e mandare a capo i <code>|</code>.
** In alcuni casi si può wrappare il testo incriminato in uno <code>span</code>, in modo che non venga interpretato come un <code>p</code>.
** Quando i metodi precedenti non sono applicabili, è possibile inserire <code><nowiki><!--</nowiki></code> alla fine di una riga e <code><nowiki>--></nowiki></code> all'inizio della successiva, in modo che il parser ignori questo a capo.
* Nei CSS delle tabelle, <code>border-collapse: collapse;</code> e <code>border-spacing: 0;</code> hanno apparentemente lo stesso effetto. In realtà c'è una differenza: il primo si mangia anche un eventuale <code>padding</code> della <code>table</code>. Morale della favola? Non usare mai <code>border-collapse: collapse</code>. Per l'altro c'è pure una simpatica classe CSS, <code>no-border-spacing</code>.
| |||