在CSS中将div内部对齐到右下角

Question

将内部div放到右下角的最简单方法是什么？

<div style="width:200px; height:200px; border:3px #FF6666 solid">
<div style="font-weight:bold; text-align:right;">Krishna</div>
</div>

这是我的代码..谢谢大家

Answer 1

尝试此操作，将外部div设置为position: relative;，确保设置为div时内部position: absolute;将保留在其中bottom: 0; right: 0;。然后，您可以通过设置<div style="width:200px; height:200px; border:3px #FF6666 solid; position: relative"> <div style="font-weight:bold; text-align:right;position: absolute;bottom: 0; right: 0; ">Krishna</div> </div> 将其指定为位于右下角。

{{1}}

Answer 2

根据div的父级，您可以将其定位为绝对值：

<div style="width:200px; height:200px; border:3px #FF6666 solid;position: relative;">
    <div style="font-weight:bold; text-align:right;position: absolute; bottom:0; right:0">Krishna</div>
</div>

Answer 3

<div style="width:200px; height:200px; border:3px #FF6666 solid; position: relative">
  <div style="font-weight:bold; position: absolute;bottom: 0; right: 0; ">Krishna</div>
</div>

Answer 4

使用内部div修改了小提琴。还添加了水印。
在此处查看更新的代码：http://jsfiddle.net/8Lu1vpbr/

#outerDiv
{
    width: 200px;
    height: 180px;
    border:3px #F02020 solid;
    position:relative;
}

#bottomRight
{
    position: absolute;
    right: 0px;
    bottom: 0px;    
}

.watermark 
{
    opacity: 0.5;
    color: BLACK;
    padding-right: 2px;
}

<div id="outerDiv">
<span> This is some content. <br />The bottom aligned item can be watermarked if needed.</span>
<div class='watermark' id="bottomRight">I am here!!!</div>
</div>

Answer 5

见这里：http://jsfiddle.net/9MYFM/

您必须将position更改为absolute。