Monaca Onsen UI Discord Chat Github Repo

Broken page when using ons-tabbar



  • 0_1538560508350_Capture.PNG
    1_1538560508352_Capture2.PNG

    main.html

      <ons-tabbar var="globalFooter" id="globalFooter">
        <ons-tab page="top/navigator.html" active>
          <span style="font-size: 12px"><img src="img/A_1.png" alt="Top" style="height: 100%"></span>
        </ons-tab>
    
        <ons-tab page="infomation/list.html">
          <span style="font-size: 12px"><img src="img/A_2.png" alt="重要情報" style="height: 100%"></span>
        </ons-tab>
    
        <ons-tab page="negotiation/list.html">
          <span style="font-size: 12px"><img src="img/A_3.png" alt="商談" style="height: 100%"></span>
        </ons-tab>
    
        <ons-tab page="project/list.html">
          <span style="font-size: 12px"><img src="img/A_4.png" alt="案件" style="height: 100%"></span>
        </ons-tab>
    
        <ons-tab page="building/list.html">
          <span style="font-size: 12px"><img src="img/A_5.png" alt="館カルテ" style="height: 100%"></span>
        </ons-tab>
      </ons-tabbar>
    

    project/list.html

    <ons-page id="project-page-list-area">
     <ons-navigator var="project_navi" id="project_navi" page="../search.html"></ons-navigator>
    </ons-page>
    

    building/list.html

    <ons-page id="building-page-list-area">
      <ons-navigator id="building_navi" var="building_navi" page="../search.html"></ons-navigator>
    </ons-page>
    

    When i press Tab on keyboard then broken layout. Please help me. Thanks