« Zurück zum Artikel

Beispiel 4

#hidden
.test1
.test2
#visible
.test1
.test2



Hier der zugehörige CSS-Code:

div {
	display: inline-block;
	border: 1px solid #000000;
	color: #000000;
}

#hidden, #visible {
	margin: 50px;
	width: 250px;
	height: 200px;
	margin: 50px;
	background: #dddddd;
}

.test1, .test2 {
	width: 100px;
	height: 100px;
	margin: 10px;
	background: #555555;
}

.test1 {
	transform: rotateX(135deg);
}

.test2 {
	transform: rotateX(45deg);	
}

#hidden div {
	backface-visibility: hidden;
}

#visible div {
	backface-visibility: visible;
}