Stack Overflow
Stack Overflow

Questions tagged [ion-grid]

22 questions
2
votes
1 answer

Is it possible to use CSS Grid with Ionic?

I'm testing since severals month angular + ionic, and I used a lot the . But since I'm doing an application that will be available on desktop AND on mobiles, sometimes I need VERY different layouts, and I find hard to achieve this sometime…
J4N
  • 19,480
  • 39
  • 187
  • 340
1
vote
1 answer

Last column jumping to the next row in ion-grid Ionic 4

I am trying to create a footer with 5 buttons/icons. Actually I am trying to replicate a tab, but without using that function. There is enough space to fit the 5 icons with teir label, however, for some reason in Android the last icon is jumping to…
Fernando Bastos García
  • 613
  • 2
  • 11
  • 26
1
vote
1 answer

Is it possible to change the order of an ion-row?

I'm implementing a responsive grid, like the one you can see in the image: I know it is possible to change the order of the columns in Ionic, but is it possible to do the same with rows? For example, currently, the order of the rows is red, yellow…
chick3n0x07CC
  • 678
  • 2
  • 10
  • 30
1
vote
1 answer

How to align an ion-avatar inside an ion-col

I am developing a simple app with Ionic v4 framework, and I have an ion-grid like this: …
FedeLanza
  • 173
  • 1
  • 3
  • 15
1
vote
0 answers

Keyboard push up content in Ionic 3

I use in my project Ionic 3 and the gridlayout to scale on different displays. The problem is when I tap into a input and the keyboard shows up the hole content is pushed up (see the screenshots). The weird thing is the red box keeps in place while…
WeSt
  • 889
  • 5
  • 14
  • 32
1
vote
1 answer

Ionic responsive multi container grid layout

Problem I wanted to create a 3 containers, one being the main big container which will take up most of the screen, and the others almost positioned as hotbars at the left and bottom. something like this. What i've tried I have tried the ion grid…
Andrew Gosselin
  • 153
  • 1
  • 16
1
vote
1 answer

How to make an Ionic grid item, editable on double click

I want to make an Ionic table that fetches the data from MongoDB.On double-clicking a row, it should be editable. I tried implementing getElementById(). But it's not supported in Ionic.
Sethulekshmi.T
  • 11
  • 2
0
votes
0 answers

Fit ion-grid width to content and all cells in the same column should have the same width

I have an ion-grid with multiple columns. I would like to make the columns fit to the content but the same column should have the same width (all cols having the width of the cell with the longest content). I know by setting size="auto", the column…
Chong you yuan
  • 19
  • 5
0
votes
0 answers

How to prevent ion-row overlap legend when using ngx-chart with ion-grid?

I am using ngx-chart with ion-grid system like below. The chart and legend works fine, the main problem is chart's legend would ignore/ignored by ion-grid system and some how get overlaped. I want to prevent this from happening and ideally making…
AkiZukiLenn
  • 337
  • 3
  • 14
0
votes
1 answer

How to stop ion-text-nowrap break ion-grid inside ion-card

I have a grid that has one row, and use ngFor to loop multiple column for each cell. Inside each cell first row will be ion-item wrap a thumbnail and the label. Below there are 1 row with 2 col. Example code. …
AkiZukiLenn
  • 337
  • 3
  • 14
0
votes
0 answers

Problems generating neat ionic template objects

I am experimenting with a small detailed grid of tiles in ionic on mobile. Essentially a rough design wireframe looks like this: A few words on what I have drawn. Each item can be described a thumbnail, a title and an array of 'tiles'. Each tile…
monkey
  • 1,213
  • 2
  • 13
  • 35
0
votes
0 answers

How to get the width of an ionic component in Ionic 4? eg: ion-grid

I want to create a perfect square with width=height. Width depends on the the view width of the page. I'm using ion-grid as the root of my custom component. How to get the height of ion-grid?
Jean-Paul Abi-Ghosn
  • 179
  • 1
  • 8
0
votes
1 answer

Ionic 5 Animate change width of columns

I’m developing an app in Ionic where certain transitions of elements are needed. In this case specifically I have a page layout of two columns, one size 8, one size 4. When clicked on “Show all” button in col size 4, I have to show more data…
Nebojša Smrzlić
  • 16
  • 2
0
votes
1 answer

ionic button click to change the color of the next column or row of a grid

I am pretty new at ionic and angular. I made a grid dynamically from a bidimensional array and 2 buttons "next column" and "next row".
…
DucaZot
  • 1
  • 1
0
votes
1 answer

How made ion-col expand the text over the col

I want to the col-8 expand a text an dont center:
David Ortega
  • 27
  • 1
  • 6
1
2