zwei Diagramme innerhalb der MD-Karte mit gleicher Höhe

Question

Ich habe zwei Diagramme innerhalb der MD-Karten-Container (eckig-Material). Beide haben eine Flex-Eigenschaft von flex = '33', was bedeutet, dass sie die gleiche Breite haben. Ich möchte jedoch, dass sie auch die gleiche Höhe haben.

Mein Code jetzt:

html:

<div id="surveyStats" layout="row" layout-wrap layout-align="center center"> 
    <md-card flex="33"> 
     <md-card-title> 
     <md-card-title-text> 
      <h4>Examples Collected For Each Intent</h4> 
      <canvas id="examplesIntent"></canvas> 
     </md-card-title-text> 
     </md-card-title> 
    </md-card> 
    <md-card flex="33"> 
     <md-card-title> 
     <md-card-title-text> 
      <h4>Intents Covered in Survey</h4> 
      <div class="intent-result"> 
      <div id="intentsCovered" layout="row" layout-align="center center"></div> 
      </div> 
     </md-card-title-text> 
     </md-card-title> 
    </md-card> 
    </div> 

css:

#surveyStats { 
    margin-top: 5%; 
} 

.intent-result{ 
    margin: auto; 
    position: relative; 
} 

ich zusätzlich einen Screenshot dieser beiden Charts hinzufügen. Kann mir bitte jemand sagen, wie sie auf die gleiche Höhe einzustellen (ohne dass in Pixel zu tun, würde ich ein ähnliches Verfahren wie das Flex = '33' Option bevorzugen.)

Answer 1

Kann nicht wirklich reproduzieren dies aber versuchen

#surveyStats { 
    margin-top: 5%; 
    display: flex; 
}