html - CSS/HTML 侧边栏被标题文本推下

标签 html css sidebar

我最近为我的用户面板设置了一个侧边栏,但它似乎被下推了。我看过其他问题线程,他们的解决方案都不给我运气。希望有人能帮我解决这个问题

CSS:

<style>


       div.menu 
{ 
width:200px; 
height:660px; 
background-color:#C0C0C0; 
left:0px; 
top:0px; 
} 

.menu ul li 
{ 
margin-bottom:20px; 
} 
body    {width: 800px; margin: 20px auto; /* center */ padding: 20px;
         border: 1px solid black;}

</style>

HTML:

<body>
<center><h3>User Panel</h3></center>
<div class="menu">
    <ul>
        <li><a href="#">Link1</a></li>
    </ul>
</div>
</body>

我会发布您要求的所有内容以帮助解决这个问题 - 希望它尽可能详细和完整,以帮助您解决问题

完整代码:

<style>


       div.menu 
{ 
width:200px; 
height:660px; 
background-color:#C0C0C0; 
left:0px; 
top:0px; 
} 

.menu ul li 
{ 
margin-bottom:20px; 
} 
body    {width: 800px; margin: 20px auto; /* center */ padding: 20px;
         border: 1px solid black;}

</style>
<body>
<center><h3>User Panel</h3></center>
<div class="menu">
    <ul>
        <li><a href="#">Link1</a></li>
    </ul>
</div>
</body>

最佳答案

您可以这样做,只需更改 html 中的顺序,使“中心”出现在侧边栏之后:

   div.menu {
    width:200px;  
    background-color:#C0C0C0;  
    float:left;  
   }  
   center {
    float:left;
    display:inline;
    width:400px;
    text-align:center;
   }  

您也可以将它设为 span 或 div 中的一个类,而不是使用已弃用的中心标记。

关于html - CSS/HTML 侧边栏被标题文本推下,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25233495/

相关文章:

javascript - HTML:如何使滚动速度更快

javascript - 检测页面上的自动点击

css - 位置背景图像中心底部有一些偏移

CSS 声明在 Chrome 检查器工具中显示两次?

iphone - ZUUIRevealController - 通过按后 Controller 中的表格 View 单元格将 View 推送到前 View 上

javascript - 禁用 Tumblr 照片集或更改它们的大小?

html - 重置高度 : auto on img element

html - 父 div 有文本对齐 :left;

javascript - 页面和帖子上的 Wordpress 侧边栏定位

css - 带有可滚动内容的嵌套粘性侧边栏