2016-08-27 23 views
1

我目前正在使用材质UI,并且遇到GridLists的问题。我有一个GridList与多个GridTiles,我没有看到任何方式分别更改每个GridList的高度。我们为GridLists提供了一个道具,让我们指定GridList cellHeight,但不能用于单个GridTiles。有谁知道一种方法来实现这一点?在材料的UI网站Material UI GridTile高度

GriList进入Material Ui Grid List

目前,我有以下(不工作)。

<GridList style={gridListStyle}> 
    <GridTile style={gridStyle1} titlePosition="bottom"> 
     <div> 
      stuff 
     </div> 
    </GridTile> 
    <GridTile style={gridStyle2}> 
     <div> 
      junk 
     </div> 
    </GridTile> 
</GridList> 
+0

如果我在'GridList'上设置'cellHeight'或者在'GridTile'上设置css'style'的高度,它们都适用于我(素材0.15.0)。 – Igorsvee

+0

当你开始给他们所有具有高度的独立样式,然后他们开始重叠时,问题就出现了。当您动态调整页面大小时,无法阻止它们在某些时候重叠。 – Shadowvail

+0

@Igorsvee我想问一个更好的问题是,如何阻止GridTiles彼此重叠? – Shadowvail

回答

0

虽然不是一个理想的解决方案,但我最终通过增加100%height!重写了覆盖GridTile组件的高度。这允许我将高度设置为我所需要的。

var gridTileStyle= { 
     position: 'relative', 
     float: 'left', 
     width: '100%', 
     minHeight: '400px', 
     minWidth: '664px', 
     overflow: 'hidden', 
     height: '100% !important' 
} 

这使得组件动态窗口调整为页面变得越来越小,而GridTile underneathe它重叠它。希望这可以帮助未来的其他人。