Испытание: расколотый кристалл [12/32] 99%

Курсы §22. Двумерные трансформации
1

Здравствуйте. Подскажите пожалуйста, почему остаётся небольшой зазор между синим и зелёным блоками (см. на фото ниже)?

image

html,
body {
width: 550px;
height: 310px;
margin: 0;
padding: 0;
}

.part-blue {
transform: translate(-120px, -80px) skewX(-45deg);
}

.part-green {
transform: translateX(15px) rotate(90deg);
}

.part-red {
transform: translate(175px, -100px) skewX(-45deg);
}

.part-yellow {
transform: translateX(40px) rotate(90deg);
}

.part-maroon {
transform: translateY(-125px) rotate(180deg);
}

.part-orange {
transform: translate(105px, 160px) rotate(-90deg) scale(2);
}

2

Ваш код дает 100%. Попробуйте сбросить и заново вставить код в окно для css.

3

Помогло. Благодарю.

4 
body {
  width: 550px;
  height: 310px;
  margin: 0;
  padding: 0;
}

.part-green {
  transform: rotate(90deg) translateY(-15px);
}

.part-maroon {
  transform: rotate(180deg) translateY(125px);
}

.part-orange {
  transform: rotate(-90deg) translate(-160px, 105px) scale(2);
}

.part-red {
  transform: translate(175px, -100px) skewX(-45deg);
}

.part-yellow {
  transform: rotate(90deg) translate(0, -40px);
}

.part-blue {
  transform: translate(-120px, -80px) skewX(-45deg);
}