如何使用CSS修复左侧网格中存在的顶部栏,而不将其与下一个右侧网格元素重叠?

时间:2018-07-09 15:50:52

标签: html css reactjs material-ui

我正在使用material-ui并做出反应,我需要修复顶部栏(不在页面顶部),该顶部栏是Grid元素(父级)的顶部栏。

我尝试使用以下方法修复topbar(child): navigation: { position: 'fixed', maxWidth: '47vw', } 网格(父)是: root: { maxWidth: '100vw', } 但是,如果Grid(父级)的宽度发生变化,则顶部栏将重叠在其父级旁边的另一个Grid元素上。我们如何解决这种重叠?还是有css属性flex继承父属性的解决方案?

1 个答案:

答案 0 :(得分:0)

Material-UI默认使用DT <- data.table(V1 = "2014120900000001091500bbbbcompany_name00032401") ,而在flex系统中,为避免此类情况,您必须使用display: flex 例如,如果您需要该元素占用某些块,则必须使用flex-grow: 1,并且要随着更改每个元素的页面分辨率而增长,则必须设置flex-basis,这意味着特定项目与其他人成长 对于flex-basis,请阅读以下内容: Flex-basis on w3schools

对于flex-grow请阅读以下内容: Flex-grow on w3schools