JSFiddle - React, Tailwind, and code Playground

by fersterin

HTML

<div class="wrap">
	<div class="dog1"><span>Lorem</span> ipsum dolor sit amet, consectetur adipisicing elit. Dicta aut cum, nulla minus. Sint maxime porro recusandae assumenda, officia tenetur fuga, quisquam dolorum perferendis <span>Lorem</span>animi illo, maiores odio exercitationem ab. Quidem, reiciendis!</div>
	<div class="dog2">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aut quasi mollitia eveniet quibusdam quos ut, exercitationem quidem perferendis earum similique.</div>
</div>

CSS

.dog1 {
	width: calc(100% - 200px); /* Резиновая колонка минус фикс ширина правой */
	background-color: lightgreen;
	float: left;
	min-height: 100%;
}
.dog2 {
	width: 200px;
	background-color: lightyellow;
	float: left;
	min-height: 100%;
}
.wrap {
	min-width: 700px;
	max-width: 1000px;
	height: 100%;
	margin: 0 auto;
}

html, body {
	height: 100%;
	min-height: 100%;
	margin: 0;
}

span {
	background-color: lightblue;
	
}