Dashboard looks great on most devices but bug on ipad and iphones.

[philgdep]

Hi there ! I'm trying to make a custom dashboard and it look great on desktop, android phone (all major browsers,...) but look crap on ipad and iphone. Look at both pictures, it's the same code. It even look great on a old android LG. I don't understand... any help/advices ?

I have some errors of timout for modules: amcharts/plugin/export/export (require.js)

desktop good:

ipad bugged:

[phildunlap]

Hi philgdep,

I would encourage you to post your code!

[Will Geller]

If you used this layout as a starting point it should stack on small devices:

<div layout="column" layout-fill flex>
    <div flex="66" layout="column" layout-gt-sm="row">
        <div flex layout="column">
            <md-card flex>
                <md-card-content>
                    Card 1
                </md-card-content>
            </md-card>
            <md-card flex>
                <md-card-content>
                    Card 2
                </md-card-content>
            </md-card>
        </div>
        <md-card flex>
            <md-card-content>
                Card 3
            </md-card-content>
        </md-card>
    </div>
    <div flex layout="column" layout-fill>
        <md-card flex>
            <md-card-content>
                Card 4
            </md-card-content>
        </md-card>
    </div>
</div>

Reading through the official angular material docs on layout should help you understand more on how this works:
https://material.angularjs.org/latest/layout/introduction

[philgdep]

The problem was that I had an open balise.
Wasn't using Sublime Text so didn't saw it in a long code.

Still strange that it was working everywhere else than iPad...
Maybe Chrome and FF are so smart that they correct the bad code themselves...

[Will Geller]

@philgdep Glad you got it worked out