Aligner les contenus verticalement au milieu de la divulgation de div

Je voudrais aligner le contenu de DIV au milieu de l'alignement vertical. La cellule de table ne fonctionnera pas ici, en raison du fait que le parent est et doit être affiché Flex. Ceci est utilisé dans le nouvel éditeur WordPress Gutenberg. Je ne veux pas modifier l'éditeur lui-même si possible et y parvenir à CSS seul. Vous trouverez ci-dessous la façon dont le code est actuellement. HTML personnalisé ne peut pas être ajouté sans édition d'éditeur d'édition. Existe-t-il une possibilité d'être réalisée dans l'état actuel?

Résultat souhaité: p>

Code actuel et état: Jsfiddle p>

HTML: P>

h3 {margin: 0 0 20px 0;}
.wp-block-columns {
    display: flex;
    flex-wrap: no-wrap;
    padding: 5px;
    border: solid 1px red;
}
.wp-block-column {
    flex: 1;
    margin-bottom: 1em;
    flex-basis: 100%;
    min-width: 0;
    word-break: break-word;
    overflow-wrap: break-word;
    flex-grow: 0;
    border: solid 1px blue;
}
.right-33 > div:first-child {
    flex-basis: 66.6666%;
    margin-right: 32px;
}
.right-33 > div:last-child {
    flex-basis: 33.3333%;
    margin-left: 32px;
}
.wp-block-image {
  background: green;
  margin: 0 auto;
  width: 100%;
  height: 200px;
}