HTML、CSS 响应式流体布局元素

Question

我正在寻找如何获得响应高度，我的意思是我有元素。

<div style="width: 100%;">
   <div style="width: 50%; float: left;"><input style="width: 100%; height: 20px" /></div>
</div>

因此，当我调整浏览器大小时，我想按比例缩放元素的高度和宽度，这可能吗？

Answer 1

试试这个，

JSFiddle

HTML

<div class="container">
<div class="inner">

<input class="input"/>

</div>
</div>

CSS

.container {
    width: 100%;
}

.inner {
    position: relative;
}
.input
{
    position: absolute;
    padding-bottom: 10%;
    width:100%;
}