vue Elemen-ui table 组件在使用flex布局后，表格宽度随页面变宽，但不能恢复的问题

时间：2021-04-12 18:10:24 阅读：31 评论：0 收藏：0 [点我收藏+]

背景：左侧伸缩导航菜单，右侧的剩余部分为表格，左侧导航隐藏后再显示，表格会出现滚动条

<div class="flex">
    <aside style="width:100px">左侧导航</aside>
    <main class="flex1">
        <el-table>
        </el-table>
    </main>
</div>

<style>

.flex{

display: flex;

}

.flex1{

flex:1;

}

</style>

后修改为定位

<div>

<main>

<el-table>

</el-table>

</main>

</div>

<style>

margin: 0;

padding: 0;

}

html,body{

height: 100%;

width: 100%;

box-sizing: border-box;

}

div {

position: relative;

height: 100%;

width: 100%;

}

aside {

position: absolute;

width: 100px;

top: 0;

bottom: 0;

left: 0;

background-color: aquamarine;

}

main {

width: 100%;

height: 100%;

padding-left: 100px;

box-sizing: border-box;

background-color: aliceblue;

}

</style>

vue Elemen-ui table 组件在使用flex布局后，表格宽度随页面变宽，但不能恢复的问题

原文：https://www.cnblogs.com/hill-foryou/p/14648827.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年09月23日 (328)
2021年09月24日 (313)
2021年09月17日 (191)
2021年09月15日 (369)
2021年09月16日 (411)
2021年09月13日 (439)
2021年09月11日 (398)
2021年09月12日 (393)
2021年09月10日 (160)
2021年09月08日 (222)