【发布时间】：2018-08-21 04:17:11
【问题描述】：
我将页面正文中的 body div 设置为 body_content。我将最小高度设置为 100%。在这个 div 中，我有 main_content div，它充当内容的包装器。也设置为 100% 的最小高度。但是，无论我如何更改我的 css，都会在我的 body_content div 中水平和垂直地添加一个滚动条。我已经使用 hidden 删除了 x，但我需要摆脱 y 滚动条并让内容正确展开。
请注意，right_body_menu 位于 main_content 的右侧。
另外，忽略 middle_body_content，因为我只是添加它来测试 div 扩展。
#body_content{
position:relative;
margin: 0 auto;
min_height = 100%;
width = 85%;
background_color = white;
border_left = 1px solid #cacaca;
border_right = 1px solid #cacaca;
overflow-x:hidden;
padding-bottom:50px;
}
#main_content{
width: -moz-calc(100% - 300px);
width: -webkit-calc(100% - 300px);
width: -o-calc(100% - 300px);
width: calc(100% - 300px);
height:100%;
float:left;
}
#right_body_menu{
min-height:100%;
background-color:white;
width:300px;
position:absolute;
right:0;
}
$main_content = "
<div id='main_content'>
<div id='body_top_wrapper'>
</div>
<hr>
" . $middle_body_content . "
</div>
$body_content = "
<div id='body_content'>
" . $main_content . "
</div>
$body_content 是我们的变量，它被回显到页面的正文部分。有什么想法吗？
【问题讨论】：
-
你试过使用 flexbox 吗？给父容器和flex的显示，它会根据内容增长和缩小
-
#body_content{ padding-bottom:50px; }- 最小高度为 100% 会引入垂直滚动条 - 除非你使用类似 flexbox CSS 的东西 -
即使删除后，该栏仍会添加。有了我目前在里面的内容，它无论如何都会扩展超过 50 像素。
-
这是您的
min-height中的#body-content中的拼写错误吗？ -
我把它全部放在了 php 中，所以我在把它放到适当的 css 中时打错了。它在我的页面上拼写正确。