SemanticUi: введите ввод ввода в заголовке меню

Question

У меня возникают проблемы с попыткой заполнить этот вход для поиска в меню ширины, но SemanticUI использует flexbox для пунктов меню.

<div class="ui top attached teal inverted large menu"> 
    <div class="header item">Header</div> 
    <div class="item">Item</div> 
    <div class="ui search item"> 
      <div class="ui left icon large input"> 
      <input type="text" placeholder="search input"> 
      <i class="search link icon"></i> 
      </div> 
      <div class="results"></div> 
     </div> 
     <div class="right menu"> 
     <div class="item"> 
      <div class="ui primary button">Button1</div> 
     </div> 
     <div class="item"> 
      <div class="ui red button"> 
       Button2 
      </div> 
     </div> 
    </div> 
    </div> 

http://codepen.io/anon/pen/BoGNvP

я могу думать только сделать это с JavaScript? или есть способ решить только css?

Answer 1

После многих попыток и исследований, это кратчайшее решение я нашел

.ui.menu .search { 
    flex: 1; 
} 

http://codepen.io/anon/pen/qOQXjL