如何在不使用宽​​度和高度属性的情况下制作完整的div？

Question

我有一个代码

<div class="outer">
 <div class="inner">A</div>
</div>

我的外部对窗口大小有响应，即宽度= 100％，高度= 100％。

我需要的是将“内部”作为100％的高度和宽度，但不使用内部的宽度和高度属性？

i.e inner{height: 100%; width : 100%}

即使我不想使用js？

Answer 1

.outer{
position:relative;
}

.inner{
position:absolute;
left:0;
top:0;
right:0;
bottom:0;
}

Demo here

Answer 2

以下是解决方案：

使用position属性。

http://jsfiddle.net/9HTSA/

Answer 3

在外部div集display:table;

上

在内部div集display: table-cell

上

<强> FIDDLE

Answer 4

我们可以使用position属性

.outer{
position:relative;
}

链接：http://www.w3schools.com/css/css_positioning.asp 学习这个

Answer 5

你可以尝试下面的代码：

<div class="outer" style="width:100%;height:100%">
  <div class="inner" style="display: block;height: inherit;">A</div>
</div>

Answer 6

访问此网址：

http://matthewjamestaylor.com/blog/equal-height-columns-cross-browser-css-no-hacks

它使用float元素作为输出。