场景：
flex的左右布局，左侧菜单宽度固定，右侧自适应。
实现：
.main{width:100%;display:flex;}
.left{flex 0 0 180px}
.right{flex:1;}
遇到的问题：
在右侧内容中，包含element-ui的table组件，当table内容列很多，宽度超出flex布局得宽度，出现横向滚动条。
解决办法：
.right{flex:1;overflow:hidden}
这样就完美解决出现横向滚动条的问题了。
flex的左右布局，左侧菜单宽度固定，右侧自适应。
.main{width:100%;display:flex;}
.left{flex 0 0 180px}
.right{flex:1;}
在右侧内容中，包含element-ui的table组件，当table内容列很多，宽度超出flex布局得宽度，出现横向滚动条。
.right{flex:1;overflow:hidden}
这样就完美解决出现横向滚动条的问题了。
场景： flex的左右布局，左侧菜单宽度固定，右侧自适应。 实现： .main{width:100%;disp...
flex 布局方向 = 设定主轴为X轴或Y轴 项目排列方向=改变主轴正方向 旧版flex 容器 display :...
弹性布局有两个轴x和y，x为主轴，y为交叉轴，通过flex可以实现改变元素所在位置 display: flex; ...
场景：x轴数据过多，出现滚动条 引入stock文件 设置滚动条属性 x轴label文案过长时，倾斜比出现省略号 m...
flex布局： 两轴： 属性：
Flex Box 布局概念 本课程的大纲 介绍水平轴和交叉轴 flex-direction flex-wrap f...
Flexbox布局 Flex Direction:决定布局主轴的方向 row:水平轴column:竖直轴 Just...
前言 在没有出现flex布局之前，几乎所有的左右布局都是使用float进行浮动的。flex布局兼容性不太好，一些老...
一、CSS方面 01. flex布局中: flex: 1的子元素超出部分出滚动条；但是IE下，横向滚动条撑满整屏问...
display:flex 意思是弹性布局 首先flex的出现是为了解决哪些问题呢？ 一、页面行排列布局 像此图左右...
本文标题：flex的左右布局，右侧出现x轴滚动条
本文链接：https://www.haomeiwen.com/subject/xbkjdftx.html
网友评论