0

Estou tentando fazer um menu superior em ionic mas esse menu esta ficando em cima do conteúdo, gostaria de saber como deixar o conteúdo abaixo do menu

Segue o código da pagina:

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <title>Ionic App</title>
  <meta http-equiv="Content-type" content="text/html; charset=utf-8">
  <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=no">
  <style>
    @-ms-viewport {
      width: 100vw;
      min-zoom: 100%;
      zoom: 100%;
    }
    @viewport {
      width: 100vw;
      min-zoom: 100% zoom: 100%;
    }
    @-ms-viewport {
      user-zoom: fixed;
      min-zoom: 100%;
    }
    @viewport {
      user-zoom: fixed;
      min-zoom: 100%;
    }
  </style>
  <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/ionic/1.3.2/css/ionic.css" />
  <script src="https://cdnjs.cloudflare.com/ajax/libs/ionic/1.3.2/js/ionic.min.js"></script>

  <body>
    <ion-view>
      <div class="bar bar-header has-tabs-top bar-positive">
        <div class="h1 title">TESTE</div>
      </div>
      <div class="tabs-striped tabs-top tabs-background-positive tabs-color-light">
        <div class="tabs">
          <a class="tab-item active" href="#">
            <i class="icon ion-home"></i>
            Test
          </a>
          <a class="tab-item" href="#">
            <i class="icon ion-star"></i>
            Favorites
          </a>
          <a class="tab-item" href="#">
            <i class="icon ion-gear-a"></i>
            Settings
          </a>
        </div>
      </div>
      <ion-content class="has-header">
        <div class="list card">
          <div class="item item-icon-left">
            <i class="icon ion-ios-bookmarks padding-top padding-bottom"></i>
            <strong>CURSO:</strong>{{curso}}
          </div>
          <div class="item item-icon-left">
            <i class="icon ion-person padding-top padding-bottom"></i>
            <strong>NOME:</strong>{{nomeAluno}}
          </div>
          <div class="item item-icon-left">
            <i class="icon ion-bookmark padding-top padding-bottom"></i>
            <strong>RA:</strong>{{ra}}
          </div>
        </div>
      </ion-content>
    </ion-view>
  </body>

</html>

Se alguem postar juntamente com o código de exemplo das views funcionando pra cada item do menu... Eu agradeço

2
  • Já tentou dar um margin-top= 5 no css do conteudo, ou um margin-bottom no menu? 9/02/2017 às 16:43
  • Com margin da pra fazer, mas o correto era ele ficar abaixo do menu obrigatoriamente. Tentar clear both mas nada tbm. 9/02/2017 às 19:03

0

Você deve fazer log-in para responder a esta pergunta.

Pesquise outras perguntas com a tag .