...右侧DIV可隐藏,当右侧DIV隐藏时,左侧DIV自动填充到右侧。怎么...

发布网友 发布时间：2024-10-23 23:47

我来回答

共2个回答

热心网友 时间：3分钟前

这个 最好 用 table 或者给 div 用table的 格式 div 是不能自动扩充的。
例table：
《table》
《tr》
《td》

《div》第一个《/div》

《/td》
《td》

《div》第二个《/div》
《/td》
《/tr》

《/table》
这样把第一个 td 隐藏了，第二个td 会 自动扩充。

div 的
css
<style>
html, body{
margin: 0;
height: 100%;
}
.main{
background:#ccc;
width: 100%;
height: 100%;
margin: auto;

min-width: 1000px;
}
.top_nav{
background:#ff0;
width: 100%;
height: 5%;
min-height: 30px;
}
.content{
background:blue;
width: 100%;
height: 90%;
display: table;
}
.toolbar{
background:red;
width: 10%;
height: 100%;
display: table-cell;
}
.main_container{

display: table-cell;
width: 90%;
height: 100%;
}
.ddd{
float: right;
height: 100%;
width: 220px;

}
.foot{
background:#900;
width: 100%;
height: 5%;
display: table;
}
</style>
html：
<div class="main">
<div class="top_nav">
</div>
<div class="content">
<div class="toolbar" > // 把他 隐藏 后边的 会自动 扩充
<div class="ddd"></div>
</div>

<div class="main_container"></div>
</div>
<div class="foot"></div>
</div>

热心网友 时间：9分钟前

<div style="width:300px;float:right;">右边的DIV</div>
<div>左边的DIV</div>
这样就OK了