Исправление панели вкладок в material-ui

Я пытаюсь исправить компонент вкладок в нижней части экрана. я пытался

<Tabs
  contentContainerStyle={{position: "fixed"}}
>
</Tabs>

и даже style={{position:"fixed"}}

Как исправить вкладки внизу?


reactjs material-ui
person Camron_Godbout    schedule 18.01.2016    source источник
comment
Думаю, вам понадобится {{position:fixed;bottom:0px;}}   -  person Dom UIXNZ    schedule 18.01.2016
comment
Извините, я хотел бы уточнить: position:fixed не исправляет вкладки.   -  person Camron_Godbout    schedule 18.01.2016
comment
Вы пробовали обернуть вкладки в div? <div style={{ position: fixed; bottom: 0 }}><Tabs /></div>   -  person azium    schedule 18.01.2016

Ответы (2)


arrow_upward
3
arrow_downward

Эта работа для меня

<div style={{position: "fixed", bottom:"0", width:"100%"}}>
 <Tabs>
   <Tab icon={<ActionFlightTakeoff />} />
     <Tab icon={<ActionFlightTakeoff />} />
     <Tab icon={<ActionFlightTakeoff />} />
   </Tabs>
</div>
person Jonhatan Fajardo    schedule 03.06.2017
comment
Следующая настройка работает визуально, однако прослушиватели событий и индикатор активной вкладки неожиданно оказываются бесполезными. - person Mateja Petrovic; 30.06.2020

arrow_upward
2
arrow_downward

Я использую tabItemContainerStyle следующим образом:

<code>
    <Tabs tabItemContainerStyle={{position: "fixed", bottom:"0"}}>
    </Tabs>
</code>
person wirapong chanto    schedule 15.03.2017
comment
Объясните, как это исправлено. - person Nevin Madhukar K; 15.03.2017
comment
Хотя этот код может дать ответ на вопрос, предоставление дополнительного контекста относительно того, как и/или почему он решает проблему, улучшит долгосрочную ценность ответа. - person Donald Duck; 15.03.2017