Corsi on-line

I valori della proprietà visibility in CSS

La proprietà visibility viene largamente utilizzata nei fogli di stile per definire regole CSS, generalmente ad essa vengono associati i valori visible, che è poi il valore predefinito per tutti gli elementi di pagina, e hidden, che consente di nascondere un elemento pur conservando lo spazio occupato da esso e, per questo motivo, si pone come alternativa a display: none che invece determina la perdita dello spazio destinato all’elemento coinvolto.

CSS

A visibility può essere attribuito anche un terzo valore meno utilizzato; esso prende il nome di collapse e svolge una funzione per certi versi simile a quella di hidden ma, come specifica il manuale ufficiale del W3C, presenta una peculiarità che influenza direttamente alcune componenti specifiche:

Only for table elements. collapse removes a row or column, but it does not affect the table layout. The space taken up by the row or column will be available for other content.

Sostanzialmente, nel caso di elementi correlati ad una tabella, con collapse avremo un comportamento simile a quello del già citato display: none, per cui lo spazio occupato da righe e colonne collassate potrà essere occupato da altri contenuti. In tutti gli altri casi, l’effetto derivante dall’utilizzo di collapse sarà il medesimo di hidden.

Alle indicazioni già presentate, il World Wide Web Consortium aggiunge altre due informazioni rilavanti: la prima, parzialmente introdotta, riguarda il fatto che il valore collapse potrà essere utilizzato esclusivamente con gli elementi per la tabulazione, inoltre, il supporto completo per esso sarà disponibile soltanto tramite alcuni browser, negli altri si potrebbero avere di problemi di rendering.

Nello specifico:

  • Internet Explorer 11, Opera browser e Firefox presentano un buon livello di compatibilità con collapse;
  • Google Chrome, per ora, non sembrerebbe in grado di operare una distinzione tra hidden e collapse.

Chiaramente, le questioni inerenti la compatibilità cross browser e cross version influiscono direttamente sulla diffusione dell’uso di questo valore.

Post correlati
I più letti del mese
Tematiche