>
  <style>
    .flex {
      display: flex;
      height: 50px;
      width: 50px;
      border: 3px solid black;
      vertical-align: top;
      margin: 20px;
      position: relative;
    }
    .child {
      border: 2px dotted purple;
      background: teal;
      width: 25px;
      height: 25px;
      align-self: safe end;
      position: absolute;
      background: yellow;
    }
    .rowDir {
      flex-direction: row;
    }
    .colDir {
      flex-direction: column;
    }
    .vertRL {
      writin