<div class="example">
	<div class="img">画像</div>
	<div class="txt">
		<h1>タイトル</h1>
		<p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p>
	</div>
</div>
* {
	box-sizing: border-box;
}
body {
	min-height: 100vh;
	background: #dce4ec;
	margin: 0;
	padding: 20px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.img {
	font-size: 18px;
	font-weight: bold;
	color: #5f7c97;
	background: #bacee1;
	text-align: center;
	vertical-align: middle;
}
.txt {
	background: #fff;
	padding: 20px;
}
.txt h1 {
	font-size: 20px;
}

.example {
	width: 100%;
	display: table;
	table-layout: fixed;
}
.example > div {
	display: table-cell;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.