css 如何将侧边栏移到页面右侧？

rggaifut 于 2022-12-30 发布在其他

关注(0)|答案(2)|浏览(184)

我正在开发我的第一个网页，我想把我的侧边栏移到页面的右边。它一直在页面的底部，我似乎无法移动它。我应该在代码中做些什么改变？
谢谢你。

/*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;
}

css

来源：https://stackoverflow.com/questions/40443164/how-to-move-sidebar-to-the-right-side-of-the-page

2条答案

按热度按时间

mrphzbgm1#

确保maincontentdiv浮动到左边，并且大小是可控的（例如，确保它不是100%）。检查maincontent的宽度，即左边的div，并将overflow设置为hidden

赞(0）回复(0）举报 2022-12-30

wi3ka0sx2#

下面是一个示例代码段，可以帮助您。
我们的想法是设置父节点的位置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>

赞(0）回复(0）举报 2022-12-30

我来回答

css 如何将侧边栏移到页面右侧？

2条答案

相关问题

热门标签

最新问答