SOURCE

function onClick(e) {
  // alert('ss', e)
  console.log(e)
};

<div class="container">
	<div class="box">
		<div class="box-title">
			<div class="box-title-main">
				标题标题
			</div>
			<div class="box-title-extra">
			</div>
		</div>
		<div class="box-content">
			<div class="box-item" onclick="onClick('1')">
				内容内容1
			</div>

			<div class="box-item" onclick="onClick('2')">
				内容内容2
			</div>

			<div class="box-item" onclick="onClick('2')">
				内容内容3
			</div>
			<div>
			</div>
		</div>
	</div>
</div>

.container {
  display: flex;
  flex-flow: row nowrap;
  border: 1px solid red;
  padding: 50px 30px;
}

.container .box {
  /* padding: 50px 30px; */
  border: 1px solid blue;
}

.box-title {
  display: flex;
  
  
  
  /* width:auto; */
  border: 1px dashed greenyellow;
}

.box-title-main {
  padding: 0px 30px;
  border: 1px solid white;
  background-color: white;
  border-radius: 30px;
  font-size: 36px;
  text-align: center;
}

.box-title-extra {
  flex: 1
}
.box-content {
  display: flex;
  flex-flow: row nowrap;
}

.box-item {
  margin-top: 40px;
  margin-left: 30px;
  border: 3px solid #222222;
  width: 188px;
  height: 80px;
  line-height: 80px;
  font-size: 28px;
  border-radius: 30px;
  background-color: white;
  text-align: center;
}