Html 对齐两个div

我有一个类似（）的网页。如您所见，有一个content div。还有一个固定在页面上的小div，并用它滚动。我想将其与内容分区的左侧对齐。我会喜欢的。有一个固定的小盒子，里面有社交分享按钮。它与左边的内容对齐。我想这样做。

您需要将sosyal paylasim div的css修改为以下内容（注意最后2个元素）：

可以找到进一步的解释

-----------编辑以使DIV位于容器外部---------------

根据您的评论，如果您希望它位于容器之外，请使用以下命令：

#sosyal-paylasim {
    background-color: #F3F6FE;
    border-color: #A5B2D0 #DBE4F3 #DBE4F3;
    border-style: solid;
    border-width: 2px 1px 1px;
    box-shadow: 0 2px 3px #E2E2E2;
    min-height: 150px;
    overflow: hidden;
    position: fixed;
    top: 200px;
    width: 64px;
    z-index: 100;

    left: 50%;
    margin-left: -557px;
}

---

诀窍是将div与左侧居中：50%，然后将其推回到主容器宽度的一半（加上div的宽度（64px）加上div的两个边框（2px）加上容器的左边框（1px），使其位于外部）。

试试看。我认为它可以满足您的需要，但如果可以重新排列两个div的顺序，则有更好的解决方案。

您是否尝试在没有javascript的情况下执行此操作？标记顺序重要吗？换句话说：可以重新排列div还是可以将小div放在内容中？另外，它在内容div的内部。它必须在外部。@Eray我以为你想要它在内部，我将编辑外部的答案。他将此标记为解决方案，因此它必须是所需的，但他使用的是固定定位，这样小div就可以在页面滚动时保持不变。你的解决方案似乎是使用绝对定位，所以向下滚动页面会丢失它…@Lucas是的，我知道。在这里，你必须能够抓住所有未提及的欲望。OP不想要一个固定的位置。他提到了一个例子，其中侧框也会滚动。（虽然时间不长，我现在明白了…；））我会尽量找时间更新答案。好的，我误解了陈述和假设的方式，因为他最初的例子是固定的，这就是他想要的。抢手货

#sosyal-paylasim {
    background-color: #F3F6FE;
    border-color: #A5B2D0 #DBE4F3 #DBE4F3;
    border-style: solid;
    border-width: 2px 1px 1px;
    box-shadow: 0 2px 3px #E2E2E2;
    min-height: 150px;
    overflow: hidden;
    position: fixed;
    top: 200px;
    width: 64px;
    z-index: 100;

    left: 50%;
    margin-left: -557px;
}