html - 如何设置部分流体布局 (IMAGE)

Question

我在为我的设计设置布局时遇到问题。

我想要两个 div，左边和右边。我希望它们填充左侧和右侧，但保持在中心的相同位置。

左侧的 div 将仅包含“始终可见”300 像素的内容(此页面不适用于移动设备)。但是在正确的 DIV 中，我希望有基于 % 的内容，以使用更大的屏幕进行扩展。在较小的屏幕上，我不希望底部有水平滚动条。

有人可以指出最佳解决方案吗？

非常感谢!

Answer 1

FIDDLE

HTML 将是:

<div class="left">Test</div>
<div class="right">Test</div>

CSS 将是:

.left {width:300px; background:#FF0000; min-height:400px; float:left; }
.right { background:#00FF00; min-height:400px;  }