在水平相邻的网页上右对齐和左对齐两个 div 标签的最佳方法是什么?如果可能的话,我想要一个优雅的解决方案来做到这一点。
问问题
214631 次
7 回答
100
<div style="float: left;">Left Div</div>
<div style="float: right;">Right Div</div>
于 2009-04-07T23:20:27.447 回答
36
作为浮动的替代方式:
<style>
.wrapper{position:relative;}
.right,.left{width:50%; position:absolute;}
.right{right:0;}
.left{left:0;}
</style>
...
<div class="wrapper">
<div class="left"></div>
<div class="right"></div>
</div>
考虑到没有必要将 .left div 定位为绝对(取决于您的方向,这可能是 .right ),因为这将位于 html 代码自然流中的所需位置。
于 2009-04-07T23:29:33.587 回答
7
<style>
#div1, #div2 {
float: left; /* or right */
}
</style>
于 2009-04-07T23:19:14.390 回答
1
你可以用几行CSS代码来完成。您可以将所有要彼此相邻出现的 div 对齐到 right。
<div class="div_r">First Element</div>
<div class="div_r">Second Element</div>
<style>
.div_r{
float:right;
color:red;
}
</style>
于 2015-04-05T04:22:00.647 回答
1
使用填充标签上面的浮动标签没有解决,我用过
padding left:5px;
padding left :30px
于 2015-10-20T06:19:40.467 回答
0
我用下面的。流派元素将从 DJ 元素结束的地方开始,
<div>
<div style="width:50%; float:left">DJ</div>
<div>genre</div>
</div>
请原谅内联CSS。
于 2015-12-18T11:47:29.160 回答
0
此解决方案在最右侧具有左对齐的文本和按钮。
如果有人正在寻找材料设计的答案:
<div layout="column" layout-align="start start">
<div layout="row" style="width:100%">
<div flex="grow">Left Aligned text</div>
<md-button aria-label="help" ng-click="showHelpDialog()">
<md-icon md-svg-icon="help"></md-icon>
</md-button>
</div>
</div>
于 2016-03-21T18:58:22.917 回答