调整浏览器大小时，元素正在移动（它们不应该移动）

Question

我试图通过尝试重新创建reddit的主页来提高我的css（和html）技能。

我遇到的问题是，当调整浏览器窗口大小时，侧边栏根本不会停留在它们应该是的位置，它们会上升，宽度也在变化。

它在我身边的方式：https://imgur.com/a/SrfyP（看看右边的东西）

它应该是这样的：https://imgur.com/a/iBEX3（它们总是保持相同的宽度和高度）

HTML只显示右侧的蓝色条，表示“提交新链接”（在imgur链接中）。我假设如果我可以让其中一个工作，我也可以使所有其他元素正常工作。

  <input step="0.1" class="number" name="SupplyAirFlow" value="" pattern=".{1,}" type="number">


document.querySelector("input.number").onkeydown = function() {
        console.log("value: ", this.value); 
}; 

CSS：

      <div class="container">
                 <div class="div1">
                       <a href="/">Submit a new link</a>
                 </div>

                 <div class="div2">
                      <a href="/">Submit a new text post</a>
                 </div>
      </div>

我尝试了很多可能性，弄乱了位置，显示，浮动，宽度，边距。这个问题已被回答了一百万次，但我找不到能帮到我的东西。

感谢您的时间。