Resurrected Clean Layout Problem

by desbest

HTML

<div class="outercontainer">
			
			<div class="innercontainerback orange"></div>

			<div class="innercontainer padding1 magenta">
					

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam convallis id tellus vitae ultrices. Phasellus elit leo, vulputate et malesuada ac, venenatis vel augue. Mauris maximus ex ac orci blandit auctor. Praesent lectus dolor, pretium vitae ultricies vel, accumsan a ante. Fusce blandit semper suscipit. Vivamus ultricies ipsum et finibus malesuada. Aliquam tempor, tellus in bibendum fringilla, nunc lacus posuere sem, nec elementum enim eros a massa. Maecenas eleifend elementum nisi accumsan luctus. Aenean ac tortor mollis, aliquam magna vel, aliquet sapien. Fusce purus quam, pulvinar quis enim nec, ornare luctus felis. Aliquam consectetur dapibus dictum. Morbi et ex eu risus euismod viverra sit amet sit amet augue. Nam mollis hendrerit tincidunt. Sed posuere suscipit ipsum id sagittis. Mauris quis sapien vitae mi tristique accumsan. Praesent cursus dui vehicula leo viverra venenatis.

Donec gravida lorem in quam lobortis iaculis. Mauris in feugiat turpis, ut mollis odio. Duis tincidunt massa malesuada, suscipit orci et, laoreet odio. In ultrices vel metus eget varius. Vivamus quis libero eu lacus mattis varius. Vestibulum venenatis nisl at ligula gravida iaculis. Vestibulum metus diam, laoreet non mi et, euismod tempor dui. Integer eu sapien ut lectus sodales cursus. In nisi nunc, faucibus feugiat velit non, molestie faucibus odio. Curabitur pretium accumsan turpis consectetur gravida. Suspendisse viverra enim a est egestas, vel lobortis augue cursus. Vivamus dignissim porta varius. Mauris gravida id augue eget convallis. Nam id dui nec arcu dapibus congue.

Sed imperdiet facilisis elementum. Nam sed magna in massa finibus viverra ac vel tortor. Morbi iaculis sollicitudin dolor vulputate luctus. Donec efficitur arcu at mauris euismod, sit amet fermentum enim elementum. Praesent sapien sem, fringilla quis elementum a,...

CSS

html, body, .outercontainer, .innercontainerback { height: 100%; min-height: 100%; }

body {
	margin: 0px;
	padding: 0px;
	font-family: Tahoma;
}

.outercontainer {
	width: 100%;
}

.innercontainerback, .innercontainer { width: 400px; }

.magenta { background-color: magenta; }
.orange { background-color: orange; }


.innercontainerback {
	/*margin-left: auto; margin-right: auto;*/
	background-image: url('https://i.imgur.com/vvaALIn.png'), url('https://i.imgur.com/trZrIdu.png');
	background-position: left, right;
	background-repeat: repeat-y, repeat-y;
	opacity: 0.88;
	z-index: 1; position: absolute; 
  /* left: 50%;  margin-left: -400px;  */
 top: 0px;
}

.innercontainer {
	/* height: 100%; */
 min-height: 100%; 
/* 	margin-left: auto;
	margin-right: auto; */
	opacity: 1 !important;
	position: relative; z-index: 0;
	clear: both;
}

.padding1 { 
	padding-left: 90px; padding-right: 90px; box-sizing: border-box;
	padding-top: 32px;
	/*margin-top: 32px; */
}