CSS: block e position: fixed

Question

Perché sarà questo codice:

div { 
    background-color: yellow; 
    display:block; 
    position:fixed; 
} 

non visualizzare la div come display:block (vale a dire il flusso di tutta la pagina) quando aggiungo position:fixed? Sembra che funzioni diversamente?

N.B. Sono molto nuovo al CSS quindi mi scuso se si tratta solo di un errore stupido

Answer 1

È necessario aggiungere larghezza e altezza a qualsiasi elemento [vuoto] con posizione fixed o absolute, altrimenti non avranno alcuna dimensione.

HTML:

<div><div> 

CSS:

div { 
    background-color: yellow; 
    display:block; 
    position:fixed; 
    width:100px; 
    height:100px; 
} 

DEMO

Infine u bisogno di qualcosa di simile this

Answer 2

Quando si utilizza position: fixed; o position: absolute;, l'elemento viene estratto Là flusso gular del documento.

L'impostazione predefinita per width per un elemento div è auto, che significa che utilizzerà l'intera larghezza disponibile dove si trova. Quando lo si estrae dal flusso, non esiste più alcuna misura utilizzabile per la larghezza disponibile (poiché ciò sarebbe infinito), quindi l'elemento otterrà la sua larghezza dal suo contenuto.