2017-02-15 4 views
1

Я использую ответные вкладки бутстрапа, я хочу показать их только в одной строке, например, возвышенном или атоме, но проблема в том, что они будут автоматически ломаться, когда они достигают ширины контейнер. Кто-нибудь знает, как я могу это сделать. Большое спасибо! Ниже мой код, используя только простые вкладки реагируют самозагрузкиСделать вкладки бутстрапа только в одной строке

return (
    <div> 
    <Tabs> 
     {this.props.tabState.map(function(v, i, obj) { 
     return (
      <Tab key={i} eventKey={i} title={titleWithBtn(v, i)} > 
      {childrenWithProps({file:v, tabIndex:i})} 
      </Tab> 
     ) 
     })} 
    </Tabs> 
    </div> 
); 

Решение
Я могу это сделать совершенно с помощью этого npm

ответ

1

Проверил Tabs структуру, она использовала ul и li для создания вкладки и класс, которые применяются, - .nav-tabs, выполните изменения в этом классе. Поместите этот стиль в head из html файл будет работать:

<style type="text/css"> 
    .nav-tabs { 
     display: inline-flex !important; 
    } 
</style>