css - 想要在 CSS 中设置控件相对于 Div 的宽度

Question

我有一个场景，我需要显示基于 div 控件的输入按钮对齐方式。div 的宽度会有所不同，所以我希望相对于 div 宽度，我的输入按钮将设置它的宽度。在这里我要粘贴两张图片

图 1:-

在第一张图片中 div 的宽度是 100px 所以 save 和 close 按钮必须放在上面此处显示的网格。如果 div 的宽度增加，则输入按钮必须随之移动。

图 2:-

在第二种情况下，如果 div 宽度增加，则按钮位置随 div 宽度移动。

编辑:-

<div class="outer">
        <input id="Submit1" type="submit" value="Save" />
        <input id="Submit2" type="submit" value="Close" />
        <div class="inner">
        </div>
</div>

这是我的场景，这里按钮的位置将取决于 inner div 的位置而不是 outer 的位置。

希望你明白。

注意:- 按钮对齐或位置完全取决于 div width 或 alignment。

Answer 1

你好伙计，我试过了:

CSS:

.container {
height:200px;
width:400px;
border:solid;}

.close {
width:33%;
float:right;
border:solid;
height:100px;}

.save{
width:33%;
float:right;
border:solid;
height:100px;
margin-right:10px;}

.content {
position:relative;
   width:100%;
height:90px;
border:solid;
bottom:2px;
float:right;}

HTML:

<div class="container">

<div class="close"></div>
<div class="save"></div>
<div class="content"></div>

</div>

http://jsfiddle.net/pNZ62/2/

当然你可以设计得更好! :P 顺便说一句，增加或减少容器的宽度，看看它是否有效! 希望我有所帮助。