Div problème de positionnement relatif dans Internet Explorer

Question

Le HTML:

<div id="broadcast"> 
    <div id="broadcast_header"> 
     Neighbourhood Broadcast 
    </div> 
</div> 

Le CSS:

#broadcast_header 
{ 
background-color: #A0522D; 
width: 100%; 
height: 20px; 
position: relative; 
top: -20px; 
font-weight: bold; 
} 

Firefox: tout va bien, en-tête apparaît 20px au-dessus du div, son sang froid.
IE: Refuse d'afficher div(broadcast_header)!

Overflow: visible
doctype Définition: Compte tenu

Mon entrée: top changement supposé - top: -5px; Il montre la div (en-tête) partiellement. Merci:].

Answer 1

Ajoutez body { margin:0 } dans votre CSS.

Answer 2

Cela fonctionne différemment. L'élément environnant (#broadcast) doit avoir la position: relative; propriété. Ensuite, vous pouvez positionner (#broadcast_header) par rapport à celui-ci en utilisant position: absolute;

#broadcast_header 
{ 
    background-color: #A0522D; 
    width: 100%; 
    height: 20px; 
    position: absolute; 
    top: -20px; 
    font-weight: bold; 
} 

#broadcast 
{ 
    position: relative; 
}