如何将侧边栏移动到页面的右侧

Question

我正在开发我的第一个网页，我想把我的侧边栏移动到页面的右侧。它的库存已经跌到谷底了，我似乎无法移动它。我应该在代码中修改什么?

谢谢。

/*sidebar*/
#sidebar{
    margin:0;
    width:250px;
    float: right !important;
    margin-right:50px;
    position:relative;
    padding: 0;
    text-align: left;
}
#sidebarcontents{
    padding:5px 0px 5px 0px;
}

Answer 1

确保maincontentdiv是向左浮动的，并且控制大小(例如，确保它不是100%)。检查maincontent的宽度，即左侧的div，并将overflow设置为hidden

Answer 2

下面是一个示例代码片段，可以帮助您。

想法是设置父元素的位置relative和子元素(侧边栏)位置absolute:

.content {
  position: relative;
}
#sidebar {
  width: 250px;
  margin-right: 50px;
  position: absolute;
  top: 0;
  right: 0;
  padding: 0;
  text-align: left;
  border: 1px solid red;
}
#sidebarcontents {
  padding: 5px 0px 5px 0px;
}

<div class="content">
  <div>Here comes my content</div>
  <div id="sidebar">
    <div id="sidebarcontents">Here are the sidebar contents</div>
  </div>
</div>