Grid don't work correctly in my project. What's the reason?

ionic-v1
1

When I mark up, my css styles don’t work adequately or some of them don’t work at all.
My questions are:

  • how to markup correctly in ionic?
  • which styles supports ionic and which not?
  • could you advise some useful tips for building with this framework?

I’ll be very thankful for all your thoughts and advices.

Here’s a specific example of my grid that works incorrectly:

       <div class="row" >

            <div class="picture col col-50">
                <img class="kartinka" ng-src="http://cafe.returnt.ru/{{foods[0].cafe_foods_image}}" >
            </div>

            <div class="strelkiUpDown col col-50">
                <div class="col">
                    <i class="btnUp button button-icon icon ion-chevron-up" ng-click="btnUp()"></i>
                </div>
                <div class="col" style="text-align: center" >
                    <a class="number">{{num}}</a>
                </div>
                <div class="col">
                    <i class="btnDown button button-icon icon ion-chevron-down" ng-click="btnDown()"></i>
                </div>
            </div>
        </div>

In the browser (during tests) it shows this:

but on the real device (android API 16) I see this:
http://pixs.ru/showimage/falseJPG_2803870_18634660.jpg

2

Can you give us a specific example? Because there’s nothing wrong with a CSS in Ionic.

2 Likes