Ionic标题隐藏了内容，尽管有类＃34; has-header＆＃34;

Question

在具有Ionic和AngularJs的应用程序上，我尝试使用标题创建一个新模板。不幸的是，标题会隐藏一些内容。

这是我的代码：

＆＃13;

＆＃13;

<link href="http://code.ionicframework.com/1.0.0/css/ionic.min.css" rel="stylesheet"/>
<div class="bar bar-header bar-stable">
  <h1 class="title">XXX</h1>
</div>
<ion-content class="has-header">
  <div class="padding-horizontal">
    <h4 class="center">Sign in</h4>
    <button class="button button-block button-positive">Sign In</button>
  </div>
  <hr>
  <div class="padding-horizontal">
    <h4 class="center">Don't have an account?</h4>
    <button class="button button-block button-positive">Sign Up</button>
  </div>
</ion-content>

＆＃13;

＆＃13;

＆＃13;

或者JsFiddle：http://jsfiddle.net/cyef9sxs/1/

谢谢！

Answer 1

您需要指定离子元素的绝对位置和宽度。

.has-header {
  top: 44px;
  position:absolute;
  width: 100%;
}