[英]How can I have two DIV s on the same line , one aligned to the left and one aligned to the right without an HTML table?
I want the votediv on the right, independent of the text size of the article with class name "note". 我想要的是表决分隔符,而与类别名称为“ note”的文章的文本大小无关。 what happens if I assign
如果我分配会发生什么
<div class="votediv" style="right:0; position:relative">
on css? 在CSS上?
<div class="opiniondiv">
<article class="opinion"></article>
<div class="opiniondetail">
<article class="note"></article>
<div class="votediv">
<form method="POST">
<button class="agreebutton" value="1">Agree</button>
<button class="disagreebutton" value="0">Disagree</button>
</form>
</div>
</div>
</div>
also, I want to do it without using 另外,我想不用
display:table
For <div class="votediv" style="right:0">
to work you have to add position: absolute
to the style. 为了使
<div class="votediv" style="right:0">
起作用,您必须在样式中添加position: absolute
。 And after that you would probably want to add position: relative
to div.opiniondiv
. 然后,您可能需要添加
position: relative
对于div.opiniondiv
。
And if you are to float the divs as others suggests here, please do not forget to clear or you will have a total mess. 而且,如果您要像其他人建议的那样使div浮动,请不要忘记清除,否则您将一团糟。
http://www.positioniseverything.net/easyclearing.html http://www.positioniseverything.net/easyclearing.html
<style>
.votediv{
float: right;
width: 50%;
}
.opiniondiv{
float: left;
width: 50%;
}
</style>
The 50% width is assuming they are both within the same parent container. 50%的宽度假定它们都在同一个父容器中。 They need to have a set width for this to work, and obviously, their combined widths must not be wider than their parent.
它们需要具有一个固定的宽度才能正常工作,并且显然,它们的组合宽度不得大于其父级。
You can use float: left
and float: right
to float an element to those sides respectively. 您可以使用
float: left
和float: right
分别将元素浮动到那些边。
<style type='text/css'>
.votediv { float: right; }
.opiniondiv { float: left; }
</style>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.