Html 在左下角定位元素时遇到问题 这是我正在搭建的推特订阅，类SRC推特基本上是海报的时间戳和用户名，应该在的右下角，但是结果是在引号的中间。 <div class="feed-bottom"> <div class="post1"> <p> "You have brains in your head. You have feet in your shoes. You can steer yourself in any direction you choose. You're on your own, and you know what you know. And you are the guy who'll decide where to go." - Dr. Suess </p> <p class="src-twitter"> @username 5:55pm September 20, 2014 </p> </div> </div>

请检查这个。时间戳现在显示在tweet的右下角。这是我添加的新CSS：

.src-twitter {
        color:#dfdfdf;
        font-size: 12px;
        float: right;
        margin-top: 0px;
    }

我已经创建了一个仍然使用绝对定位的系统

CSS:

HTML:

“你脑子里有头脑，脚踏实地。你可以选择任何方向引导自己。你靠自己，你知道自己知道什么。你是决定去哪里的人。”-苏伊斯博士

@username 2014年9月20日下午5:55

我在HTML中添加了一个简单的重置，这样您就可以更好地控制边距和填充，因为这也会影响元素的位置（对齐）。然后我添加回填符，然后使用相同的单位将作者姓名定位为负数底部（您没有这样做，这就是为什么它在主段落的中间）。

<代码> “你脑子里有头脑，脚踏实地。你可以选择任何方向引导自己。你靠自己，你知道自己知道什么。你是决定去哪里的人。”-苏伊斯博士

@用户名2014年9月20日下午5:55

---

绝对位置不会扩展post1的高度。。。简单的解决方法是添加一个空的空间。或者，您可以指定post1的高度。

似乎不需要使用

位置

进行此操作，只需

文本对齐

即可

更新的CSS：

.src-twitter {
    color:#dfdfdf;
    font-size: 12px;        
    text-align:right;
}

---

Morgan's，提供空间的方法稍微干净一点，填充：16pxCheers Wayne，仅供参考：在响应性网页设计的时代，增加一个固定高度不是一个好主意；）MorganFeeney强调问题是因为没有可用的高度，而不是将设置高度作为一个解决方案。它仅适用于由于图形或具有固定高度的东西而固定高度的情况。我更倾向于设计。语义HTMLIMHO的两个重要标记是包装器和背景标记。

* {
    margin: 0;
    padding: 0;
}   
.post1{
    position: relative;
    padding: 16px;
}
.src-twitter {
    color:#dfdfdf;
    font-size: 12px;
    position: absolute;
    bottom: -16px;
    right: 16px;
}

<div class="feed-bottom">
 <div class="post1">
  <p>"You have brains in your head. You have feet in your shoes. You can steer yourself in any direction you choose. You're on your own, and you know what you know. And you are the guy who'll decide where to go." - Dr. Suess</p>
  <p class="src-twitter">@username 5:55pm September 20, 2014</p>
 </div>
</div>

<div class="feed-bottom">
                <div class="post1">
                    <p>
                        "You have brains in your head. You have feet in your shoes. You can steer yourself in any direction you choose. You're on your own, and you know what you know. And you are the guy who'll decide where to go." - Dr. Suess
                    </p>
                    <p> &nbsp; </p>
                    <p class="src-twitter">
                        @username 5:55pm September 20, 2014
                    </p>
                </div>
            </div>

.src-twitter {
    color:#dfdfdf;
    font-size: 12px;        
    text-align:right;
}