javascript - 如何并排显示两个div，左侧div固定位置，右侧div垂直滚动

Question

我正在创建一个网页，我必须在其中并排显示两个 div 元素。

我想要固定位置的左 div，而右 div 应该滚动。

HTML 结构:

<div id="fixed-position">
  <ul>
    <li><a></a></li>
    <li><a></a></li>
    <li><a></a></li>
    <li><a></a></li>
  </ul>
</div>
<div id="result">
   It contains a big table
</div>

在上面的 html 中，单击“a”标签时，我进行了一个 ajax 调用，获取一个大表作为响应并将其分配给具有属性 id="result" 的第二个 div

>

请帮我解决这个问题。 谢谢。

Answer 1

    <div style="overflow:hidden;width:100%;">
    <div  style="width:50%;height:100px;overflow:hidden;float:left;background-color:#009900;">
  <ul>
    <li>aaaaaa</li>
    <li>bbbbbb</li>
    <li>cccccc</li>
    <li>dddddd</li>
  </ul>
      </div>
    <div  style="width:50%;height:100px;overflow-x:hidden;overflow-y:scroll;float:right;background-color:#00CCFF;"  id="result">
   It contains a big table <br>
   It contains a big table <br>
   It contains a big table <br>
   It contains a big table <br>
   It contains a big table <br>
   It contains a big table <br>
   It contains a big table <br>
      </div>
      </div>