Unusual behavior when uploading ionic project to a web server instead of uploading it in the app store

Okay so I know that the ionic framework is mainly used to build hybrid apps and upload them to the App Store or the Play Store, however, I decided to try something different. It is still under construction, but I tried to upload a project of mine to the web. I had a domain, so I used filezilla and uploaded the www folder from my project. Everything worked like a charm. Then I accessed the website using a PC. Everything seemed fine, unfortunately when I accessed the website using a smartphone there were several problems.

  1. The home page is supposed to lack a navigation bar (in the ion-view I have a line hide-nav-bar="true"), yet when using smartphone it is filled with white space.
  2. I have a search input as a subheader in two different tabs, which is displayed as just whitespace too.

As I said before these two problems occur only when the website is accessed by a smartphone or a tablet.

Here is the code of the home tab (home.html)

<ion-view hide-nav-bar="true">
  <ion-content class="splash padding">
    <div class="branding">
      <h3>I haven't been everywhere, but it's on my list!</h3>
    </div>
  </ion-content>
</ion-view>

Here is the code from one of the tabs, using a search input

<ion-view view-title="Newest posts">
<div class="bar bar-subheader 
  item-input-inset bar-light">
  <label class="item-input-wrapper">
    <i class="icon ion-search placeholder-icon"></i>
    <input type="search" ng-model="postQuery" placeholder="Search for post">
  </label>
</div>
<ion-content class="has-subheader">
...
</ion-content>
</ion-view>

enter image description here

Actually here the white space is not visible, because of the background of the website, but the next picture makes it obvious.

enter image description here