ionic-team / ionic-v1

The repo for Ionic 1.x. For the latest version of Ionic, please see https://github.com/ionic-team/ionic
Other
192 stars 187 forks source link

Margin/padding also gets applied on the tabs-top due to which whole design is messed up (ionic 1.3.5) #361

Open razam217 opened 6 years ago

razam217 commented 6 years ago

Note: If you are having problems formatting your issue please refer to this article on using markdown in Github:

https://guides.github.com/features/mastering-markdown/

Note: for support questions, please use one of these channels:

https://forum.ionicframework.com/ http://ionicworldwide.herokuapp.com/

Short description of the problem:

Due to iPhone X UI issues, I updated ionic from 1.1.1 to 1.3.5 and also added viewport attribute. Everything else works fine, but in my app there are two different tabs:

What behavior are you expecting?

Tabs-top should only have (safe-area-inset-top) instead of (safe-area-inset-bottom).

Steps to reproduce:

  1. Add tabs-top
  2. Add tabs-bottom
  3. Also add some content like list items etc, so that you can see the issue.
insert any relevant code between the above and below backticks

Other information: (e.g. stacktraces, related issues, suggestions how to fix, stackoverflow links, forum links, etc)

Which Ionic Version? 1.x or 2.x

Plunker that shows an example of your issue

For Ionic 1 issues - http://plnkr.co/edit/Xo1QyAUx35ny1Xf9ODHx?p=preview

For Ionic 2 issues - http://plnkr.co/edit/me3Uk0GKWVRhZWU0usad?p=preview

Run ionic info from terminal/cmd prompt: (paste output below)