0
I’m trying to make a top menu in Ionic but this menu is getting on top of the content, I would like to know how to leave the content below the menu
Follow the page code:
<!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>If someone posts along with the sample code of the views working for each menu item... I thank you
Ever tried to give a margin-top= 5 in content css, or a margin-bottom in the menu?
– JdsMedeirosBR
With margin da para fazer, but the correct was to stay below the menu obligatorily. Try to clear Both but nothing tbm.
– Max Rogério