Question

我在div中有一个div，它不会移动到我想要的中心。这是一张名为youthcouncil的图片

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;
}

Answer 1

已更新

我为您删除了一些部件，以便更容易看到它是如何工作的。现在您应该可以添加其他图像等。

演示：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 */
}

Div不会升到应有的位置

1 个答案: