la larghezza e l’altezza per una span non vengono visualizzate a meno che non venga immesso un testo

Ho e il css è

 #some{ background-color:#000; width:150px; height:50px; } 

La larghezza e l’altezza non vengono visualizzate a meno che non venga inserito qualcosa. Come posso risolvere questo?

span è un elemento inline, quindi senza dire al browser che la sua proprietà display come block non funzionerà.

Quindi in breve:

 #some{ background-color:#000; width:150px; height:50px; display: block; } 

Spero che aiuti, Sinan

Non puoi dare un’altezza / larghezza a un elemento in linea, è dimensionato dal suo contenuto, ma puoi renderlo display: inline-block; come questo:

 #some{ background-color:#000; width:150px; height:50px; display: inline-block; }​ 

Guarda un esempio qui , nota che IE7 in particolare non gestirà questo in alcune situazioni, quindi display: block; lavorerebbe lì (ma onestamente, perché non usare solo un

allora?) … ma tenete a mente che il inline-block in inline-block è nel stream, mentre il block calcia tutto su una linea.

Si può fare in modo che la larghezza e l’altezza della span funzionino anche senza impostare il display come blocco impostando il valore della posizione come assoluto.

 .green-box{ background-color:gold; position:absolute; width:300px; height:100px; border: 2px solid silver; } 

Controlla questo link per maggiori informazioni: = https://jsfiddle.net/vipingoyal1000/oa2ssb19/

Una soluzione comune sta usando & nbsp; nel tag span. (Suppongo che tu voglia renderlo display:block; pure?)

Dato che tutti gli altri hanno parlato di span è un elemento inline, o è necessario renderlo elemento block (usando display: block) o usare block element (div) al suo posto. Per comprendere meglio gli elementi inline e di blocco, nonché l’intero modello di rendering html / css, ti suggerisco di leggere http://www.w3.org/TR/CSS2/visuren.html .

Usando display: block; funzionerà perfettamente.

Grazie Rex