Exemple jsfiddle simple ne fonctionne pas

Question

Je sais que beaucoup de questions sont posées comme ça, mais je ne sais pas quoi écrire que cela. Ceci est mon violon:

HTML: <div id="myDiv" ></div>

CSS:

#myDiv 
{ 
    background-color:black; 
    width:100%; 
    height:100%; 
} 

Comment ce violon peut faire une div qui est sur la page du trou et est noir?

Answer 1

Si vous voulez que div prendre toute la page dont vous avez besoin tous les éléments parents d'avoir height ensemble à 100% ainsi:

body, html { 
    height:100% 
} 

#hider 
{ 
    background-color:black; 
    width:100%; 
    height:100%; 
} 

jsFiddle: http://jsfiddle.net/CnJF5/8/

Answer 2

100% de quoi? La valeur par défaut pour width et height est auto. Si vous voulez une page noire, vous devez également donner des valeurs aux ancêtres de <div>.

html, body { 
    width:100%; 
    height:100%; 
} 

Answer 3

Vous devez définir

body, html { 
    height: 100% 
} 

éléments respectent seulement la hauteur du pourcentage si leurs parents ont une hauteur fixe.

• http://www.tutwow.com/htmlcss/quick-tip-css-100-height/
• http://jsfiddle.net/CnJF5/11/

Answer 4

Try this ... http://jsfiddle.net/CnJF5/12/

#myDiv { 
    z-index: 10000; 
    filter: alpha(opacity=50); /*older IE*/ 
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); /* IE */ 
    -moz-opacity: .50; /*older Mozilla*/ 
    -khtml-opacity: 0.5; /*older Safari*/ 
    opacity: 0.5; /*supported by current Mozilla, Safari, and Opera*/ 
    background-color:#000000; 
    position:fixed; 
    top:0px; 
    left:0px; 
    width:100%; 
    height:100%; 
    text-align:center; 
    vertical-align:middle; 
}​