Material UI 100 % 신장을 가져 오는 DropDownMenu

Question

테이블 열 내에 렌더링되는 특정 페이지에 DropDownMenu가 있습니다. 나는 메뉴를 엽니 다 클릭하면

, 그것은 페이지 높이의 100 %가 열립니다.

나는 문서에서이 같이 아무것도 없으며, 지역 사회를 찾을 수 없습니다.

하위 구성 요소와의 상대적인/절대적인 컨테이너 관계가 없습니다.

maxHeight으로 설정하려고 시도했지만 동일하게 발생합니다.

도움 주셔서 감사합니다.

편집 :

일부 코드.

export default ({ 
    variables, 
}: Props) => (
    <Table multiSelectable> 
    <TableHeader enableSelectAll> 
     <TableRow> 
     <TableHeaderColumn className={styles.headerColumn}>Variável</TableHeaderColumn> 
     <TableHeaderColumn className={styles.headerColumn}>Tipo</TableHeaderColumn> 
     <TableHeaderColumn className={styles.headerColumn}>Linha 01</TableHeaderColumn> 
     <TableHeaderColumn className={styles.headerColumn}>Linha 02</TableHeaderColumn> 
     <TableHeaderColumn className={styles.headerColumn}>Linha 03</TableHeaderColumn> 
     </TableRow> 
    </TableHeader> 
    <TableBody> 
     {variables.map(variable => (
     <TableRow key={variable.id}> 
      <TableRowColumn className={styles.column}>{variable.header}</TableRowColumn> 
      <TableRowColumn className={styles.columnDropdown}> 
      <DropDownMenu value={variable.type}> 
       <MenuItem value="numerical" primaryText="Numérica" /> 
       <MenuItem value="categorical" primaryText="Categórica" /> 
       <MenuItem value="key" primaryText="Chave" /> 
       <MenuItem value="answer" primaryText="Resposta" /> 
      </DropDownMenu> 
      </TableRowColumn> 
      {variable.line.map(line => (
      <TableRowColumn key={line} className={styles.column}>{line}</TableRowColumn> 
     ))} 
     </TableRow> 
    ))} 
    </TableBody> 
    </Table> 
); 

이 코드는 SASS 모듈을 사용합니다 :

.headerColumn { 
    font-size: 16px !important; 
} 

.column { 
    font-size: 14px !important; 
} 

.columnDropdown { 
    @extend .column; 
    padding-left: 0 !important; 
} 

내가이 구성 요소의 절대 아무 수레 아무것도 없다

이

은 DropDownMenu가 인스턴스화하는 구성 요소입니다. 열려있는 메뉴를 분석하면 top: 0과 max-height: 1014px;이됩니다. 이유는 말할 수 없습니다.

Answer 1

[data-reactroot] { 
    height: 100% !important; 
} 

이것은 엉망이되었습니다.