Ich brauche Sie helfen, dieses Gitter zu machen. Wenn ich die Größe des Fensters ändere, behält das Raster nicht die ursprüngliche Form bei. Ich brauche das Raster, um zu reagieren, und ich kann es nicht tun. Ich habe versucht, so viel Zeit mit vielen ModifikationenResponsive Gitter - IONIC 2
Dies ist mein Code so weit.
page-home {
*{
margin: 0;
padding: 0;
}
ion-header{
background-color: #fff;
height: 3em;
width: 100%;
font-size: 15px;
}
ion-toolbar{
height: 1em;
padding: 0;
width: auto;
display: block;
}
.toolbar-md{
padding: 4px;
min-height: 40px;
padding-left: 40px;
}
ion-toolbar.logo img{
height: 1.3em;
}
ion-toolbar.container{
color: #fff!important;
}
ion-content{
margin: 80px 0px;
min-height: 56vh;
}
ion-col.info{
text-align: center;
background-color: #fff;
border: 1px solid #ddd!important;
}
ion-row.title ion-col{
text-align: center;
font-weight: bold;
background-color: #eee;
border: 1px solid #ddd!important;
}
ion-grid.footer-table{
width: 30%;
}
}
<ion-content>
<ion-grid fixed>
<!-- Titles -->
<ion-row class="title">
<ion-col col-2>
EVENT
</ion-col>
<ion-col col-2>
ORIGIN
</ion-col>
<ion-col col-2>
DESTINY
</ion-col>
<ion-col col-2>
ERRORS
</ion-col>
<ion-col col-2>
FIRST EVENT
</ion-col>
<ion-col col-2>
LAST EVENT
</ion-col>
</ion-row>
<!-- Data -->
<ion-row class="inforow">
<ion-col class="info" col-2>
ETA
</ion-col>
<ion-col class="info" col-2>
SLI
</ion-col>
<ion-col class="info" col-2>
ODBMS
</ion-col>
<ion-col class="info" col-2>
6
</ion-col>
<ion-col class="info" col-2>
04/08/2017
</ion-col>
<ion-col class="info" col-2>
04/08/2017
</ion-col>
</ion-row>
</ion-grid>
</ion-content>
Bitte lassen Sie mich irgendeine Art und Weise kennen dieses Problem zu lösen.
Dank
Entfernen Sie alle Ihre benutzerdefinierten 'CSS' und sehen Sie das Ergebnis? – Sampath
Wenn ich die Stile lösche, sehe ich nichts im Fenster, nur den Titel und das Logo. Ich möchte nur ein Raster erstellen, dessen Größe je nach Anzeigeort (Desktop oder Handy) geändert werden kann. – bECkO