<textarea class="anchor-1"></textarea>
<textarea class="anchor-2"></textarea>
<div class="target"></div>
.anchor-1 {
  position: absolute;
  top: 0;
  left: 0;
  anchor-name: --anchor-1;
}

.anchor-2 {
  position: absolute;
  bottom: 0;
  right: 0;
  rotate: 180deg;
  anchor-name: --anchor-2;
}

.target {
  background: #222;
  position: absolute;
  
  top: anchor(--anchor-1 bottom);
  left: anchor(--anchor-1 right);
  bottom: anchor(--anchor-2 top);
  right: anchor(--anchor-2 left);
}
// Fidgeting with the original demo from Chris Coyier: https://codepen.io/chriscoyier/pen/gONEEZd?editors=0110

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.