Div没有向上移动

时间:2014-03-06 06:06:56

标签: css html

基本上我即将完成我的第一个真正的index.html但是一个顽固的错误阻止我这样做。 “推特”div并没有将自己定位在24小时的正确位置,而是被卡在中间位置。即:

HTML

<div id="divFooter">
    <div id="row1">
         <h4 id="title4">24 HOUR CUSTOMER SERVICE</h4>

        <div id="contactos">
            <img src="imgs/icon-phone.png" id="custumerServiceImg">
            <p>512-943-1069</p>
            <p>512-943-1068</p>
        </div>
        <div id="contactos" class="color">
            <img src="imgs/icon-email.png" id="custumerServiceImg">
            <p><a href="#">info@WTPcom</a>

            </p>
        </div>
        <div id="contactos">
            <img src="imgs/icon-address.png" id="custumerServiceImg">
            <p>1341 Oakmound Drive</p>
            <p>Chicago, IL 60609</p>
        </div>
    </div>
    <div id="tweets" class="color">
         <h4 id="title4">RECENT TWEETS</h4>

        <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
        <p><a href="#">- 1 day ago</a>

        </p>
        <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
        <p>
            <p><a href="#">- 2 days ago</a>

            </p>
    </div>
</div>  

CSS:

#divFooter {
    background: url("../imgs/bg-footer.jpg");
    position: relative;
    margin: 400px 0 0 0;
    height: 291px;
    width: 956px;
}
#custumerServiceImg {
    float: left;
}
#row1 {
    width: 318px;
    padding: 20px 0 0 0;
}
#row1 p {
    padding: 0 0 0 30px;
    margin: 0 0 10px 0;
    color: #404040;
    font-family:'Quattrocento Sans', sans-serif;
    font-size: 14px;
}
#row1 img {
    margin: 0px 0 10px 0;
}
#contactos {
    padding: 10px 0 10px 0;
}
#title4 {
    color: #404040;
    font-family:'Quattrocento Sans', sans-serif;
    font-size: 14px;
}
#tweets {
    float: left;
    position: absolute;
    margin: 0 0 500px 250px;
    width: 318px;
}

任何有关如何不再失败的帮助和指示将再次受到高度赞赏 祝福

2 个答案:

答案 0 :(得分:0)

只需将float:left添加到#row1

即可
#row1{
  float:left;
width: 318px;
padding: 20px 0 0 0;
}

请参阅工作Lab Demo

答案 1 :(得分:0)

将此css替换为您的

#tweets{ position: absolute; width: 318px; top:0; left:330px; }

http://jsfiddle.net/