html - 网页元素位置问题

Question

使两个元素中的每一个占据其父元素宽度的一半。

这是我的例子:

http://jsfiddle.net/zUqqN/

我只想默认不显示 div#mapContent_coverage，然后 div#mapContent_emap 将占据“mapDiv”的所有宽度，

当用户点击右边的img时，div#mapContent_coverage应该显示出来，然后“ma​​pContent_emap”和“mapContent_coverage”会同时显示，并且我希望它们都占宽度的一半。

我试过对 div 使用 float 和 absolute，但它不起作用，知道吗？

顺便说一句，我不想​​在浏览器中显示滚动条，例如:

现在不管我怎么调整浏览器大小，都没有滚动条。怎么做这个？

更新:

默认页面布局:

当我点击右侧的 img 时，页面应该变为:

Answer 1

要显示两者，请将每个宽度设置为 50%。要仅显示一个，请将宽度设置为 100% 并隐藏另一个。