chromium/third_party/blink/web_tests/transforms/transforms-with-opacity.html

<html>
<head>
<style>
div {
  width:100px;
  height:100px;
  border:10px solid black;
  background-color:skyblue;
}

.transparent {
  opacity: 0.5;
}

.translated {
  transform:translate(120px, -10px)
}
</style>
</head>
<body>
In the example below you should see three blocks right next to one another, and they should all be partially transparent.

<div class="transparent">
<div class="translated"><div class="translated"></div></div>
</div>