2017-07-30 58 views
1

我试图从material-ui中为纸张制作垂直中心。如何在纸张材质-UI中定位文本

我的代码是波纹管

const style = { 
 
    height: 150, 
 
    width: 150, 
 
    margin: 20, 
 
    textAlign: 'center', 
 
    rounded: true 
 
}; 
 

 

 
render() { 
 
    let { currentTime, isRunning } = this.state; 
 
    let stopWatchTime = this.showCorrectTime(currentTime); 
 
    let buttonName = isRunning ? 'Stop' : 'Start'; 
 
    let buttonRole = isRunning ? this.stopTime : this.startTime; 
 

 
    return (
 
     <div> 
 
     <TextField 
 
      multiLine 
 
      rows={2} 
 
      rowsMax={4} 
 
     /> 
 
     <Paper style={style} zDepth={5} circle >{stopWatchTime}</Paper> 
 
     <button onClick={buttonRole}>{buttonName}</button> 
 
     </div> 
 
    ); 
 
    } 
 
}

我试图verticalAlign但于事无补。此外,我没有在文档中找到包含文本的选项。请现在谁提供信息如何在Paper中居中文本或信息如何处理一般的文字。

图像的例子,我有什么现在

1

回答

2

而是直接把里面的内容纸业,把那里面div和使用css性质以正确对齐。

像这样:

<Paper style={style} zDepth={5} circle > 
    <div style={{marginTop: '....'}}> 
     {stopWatchTime} 
    </div> 
</Paper> 

检查这个例子:https://jsfiddle.net/mayankshukla5031/o22jy5hs/

+0

感谢,它帮助 –