Div將不會移動到它應該在的位置

我有一個div內的div，不會移動到我想要的中心位置。這就是所謂的youthcouncilDiv將不會移動到它應該在的位置

HTML

<div id="header"> 
    <img src="file:///E:/Crios%20Óige/Crios%20Oige%20Images/Logo.png" id="logo"> 
    <img src="file:///E:/Crios%20Óige/Crios%20Oige%20Images/Title.PNG" id="title"> 
    <img src="http://www.youtharts.ie/sites/youtharts.ie/files/NYCI%20Logo%20Full%20JPG_2.jpg" id="youthcouncil"> 
</div>

相應的CSS

#header { 
height: 100px; 
width: 2000px; 
background-color: #993333; 
margin-top: -10px; 
} 
#youthcouncil { 
height: 80px; 
width: 180px; 
margin-left: 300px; 
margin-top: 5px; 
} 
#logo { 
height: 80px; 
width: 180px; 
margin-left: 20px; 
margin-top: 5px; 
} 
#title { 
height: 80px; 
width: 180px; 
margin-left: 250px; 
margin-top: 5px; 
}

來源

2014-02-27 Edward Leonard

'保證金左：300像素;'有些事情真的錯了 –

請分享預覽或小提琴，以便我們可以看到問題 –

因此，您希望圖像youthcouncil垂直居中與紅色背景的div不正確？ –

修訂

我去掉了一些零件給你，使之更容易看到它是如何工作的形象。現在你應該可以加回你的其他圖像等

演示：http://jsfiddle.net/UKAEu/2/

HTML

<div id="header"> 
    <img src="http://www.youtharts.ie/sites/youtharts.ie/files/NYCI%20Logo%20Full%20JPG_2.jpg" id="youthcouncil" /> 
</div>

CSS

#header { 
    height: 100px; 
    width: 500px; 
    background-color: #993333; 
} 
#youthcouncil { 
    height: 80px; 
    width: 180px; 
    margin-top: 10px; 
    position: relative;   /* make it moveable */ 
    left: 50%;     /* push left edge to center */ 
    margin-left: -90px;   /* push back half its width */ 
}

來源

2014-02-27 19:43:45 LGSon

Div將不會移動到它應該在的位置

回答

相關問題