关于display：inline-block，overflow:hidden;的问题

# 具体遇到的问题
不是很能理解display:inline-block和overflow:hidden在代码中起到的作用，inline-block具体有什么特性呢？

overflow:hidden不是防塌陷吗，它还有什么特性吗？不让内部元素超出其长度是什么意思？

# 报错信息的截图

# 相关课程内容截图

# 尝试过的解决思路和结果

# 粘贴全部相关代码，切记添加代码注释（请勿截图）

在这里输入代码，可通过选择

​@import 'reset.scss';

$baseFontSize:17px;
$redColor:#d43d3d;
$img:'assets/';
.header{
	height:45px;
	background-color:$redColor;
	.title_logo{
		width:100px;
		height:100%;
		margin:0 auto;
		background:{
			position:center;
			size:contain;
			repeat:no-repeat;
			image:url($img+'wap_logo@3x_581de69e.png');
		}
	}	
}
.top_bar{
	height:34px;
	background-color:#f4f5f6;
	//x轴内容超出时可以滚动
	overflow-x:auto;
	//y轴不可以滚动
	overflow-y:hidden;
	.top_menu_list{
		//内容超出时不换行
		white-space:nowrap;
		//不让内部元素超出其长度
		overflow:hidden;
		height:100px;
		//样式依赖于子元素，子元素的宽度撑开，
		//超过父元素时，会出现滚动条
		display:inline-block;
		.btn{
			padding:8px;
			display:inline-block;
			font-size:$baseFontSize;
		}

	}
}

【代码语言】突出显示

.top_menu_list{
		//内容超出时不换行
		white-space:nowrap;
		//不让内部元素超出其长度
		overflow:hidden;
		height:100px;
		//样式依赖于子元素，子元素的宽度撑开，
		//超过父元素时，会出现滚动条
		display:inline-block;
		.btn{
			padding:8px;
			display:inline-block;
			font-size:$baseFontSize;
		}