提问者:小点点

如何将元素对齐到div框的右侧?[副本]


<div id="foo">
    <div id="tree">Some Text here</div>
</div>
#foo {
    display: block;
    width: 500px;
    height: 500px;
    background: #5e5e5e;
}

#tree {
    width: 100px;
    height: 30px;
    background: #000000;
}

我需要树放置在右上角的Foo。


共2个答案

匿名用户

有几种方法可以实现这一点。一种方法是在树中添加一个自动的左边距:

margin-left: auto;

另一个选择是将float:right;应用于树,这可能导致也可能不会导致您需要的内容流。

最后,老实说,我的建议是只使用FlexBox。

null

#foo {
    display: block;
    width: 500px;
    height: 500px;
    background: #5e5e5e;
}

#tree {
    width: 100px;
    height: 30px;
    background: #000000;
    margin-left: auto;
}
<div id="foo">
    <div id="tree">Some Text here</div>
</div>

匿名用户

给float:右转到#tree。

null

#foo {
    display: block;
    width: 500px;
    height: 500px;
    background: #5e5e5e;
}

#tree {
	float: right;
    width: 100px;
    height: 30px;
    background: #000000;
}
  <div id="foo">
		<div id="tree">Some Text here</div>
	</div>