我在将dT(日期/时间)div放在包含div的底部时遇到问题。我试过设置bottom: 0px;
无济于事。下面是我正在使用的html和css代码。
HTML:
<div class='container'>
<aside>
<img id="user-pic" src="images/blank-user.jpg">
<a href="#">@User_Name</a>
<div id="trend"><h6>TRENDING</h6></div>
</aside>
<section class="main">
</section>
</div>
CSS:
#dT{
width:inherit;
bottom: 0px;
border-top: gray;
background-color: gray;
font-size: small;
}
.container{
margin-top: 80px;
}
section{
margin: auto;
width: 400px;
clear: left;
top: 100px;
}
.tweet{
width: 450px;
height: 225px;
background-color: #FFFFFF;
border: 4px solid #F1433F;
border-top-left-radius: 20px;
border-bottom-right-radius: 20px;
margin-bottom: 15px;
padding: 25px 15px 0px 15px;
}
.tweetContent{
width: inherit;
height: inherit;
margin: 5px 5px 0 5px;
border-bottom: 1px solid #EEEEEE;
border-top: 1px solid #EEEEEE;
}
我的代码中有一些JQuery元素,我没有提出,因为我不相信它会对div的定位产生任何影响。
看起来代码的jquery方面可能与它有关,所以在这里。
更新:删除了JQuery,因为它不相关。
答案 0 :(得分:4)
将position:relative
添加到#dT
元素的父级。只有它是相对的,您才能使用left
,right
,bottom
和top
来控制子元素。
<强>更新强>
对于要使用left
添加position:absolute
P.S:需要为包含#dT和relative
的div添加absolute
#dT
#parentofdT
{
position:relative;
}
#dT
{
position:absolute
}
答案 1 :(得分:1)
使用position:absolute;
轻松设置像素:https://jsfiddle.net/1Lsnjou9/
答案 2 :(得分:0)
你应该添加position:relative或position:absolute属性来制作底部:0px work
#dT{
width:inherit;
bottom: 0px;
border-top: gray;
background-color: gray;
font-size: small;
position: relative;
}
答案 3 :(得分:0)
使用位置属性,如位置绝对位置或位置相对位置,以便使用top,left,right,bottom属性