# Fluid grid

**URL:** <https://forum.ionicframework.com/t/fluid-grid/218710>\
**Category:** Ionic Framework\
**Created:** [December 23, 2021, 4:07pm UTC](https://forum.ionicframework.com/t/fluid-grid/218710 "2021-12-23T16:07:45Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![strarsis](https://avatars.discourse-cdn.com/v4/letter/s/a88e4f/32.png) [@strarsis](https://forum.ionicframework.com/u/strarsis)\
**Post date:** [December 23, 2021, 4:07pm UTC](https://forum.ionicframework.com/t/fluid-grid/218710/1 "2021-12-23T16:07:45Z")

</div>

I can have a grid of varying columns - but how can I make it fluid?  
On mobile I want 2x columns, but on tablet and wider I want 3x, 4x or even 6x columns.  
The column count seems to be hardcoded as the grid, rows and columns are specified directly in markup.  
How can I control this?

---

<div class="post-metadata">

**Author:** ![Hills90210](https://avatars.discourse-cdn.com/v4/letter/h/57b2e6/32.png) [@Hills90210](https://forum.ionicframework.com/u/Hills90210)\
**Post date:** [December 23, 2021, 4:37pm UTC](https://forum.ionicframework.com/t/fluid-grid/218710/2 "2021-12-23T16:37:55Z")

</div>

By adding the proper breakpoints. Here is great documentation Ionic has provided that explains this in great detail.

> **[Responsive Grid | Ionic Documentation](https://ionicframework.com/docs/layout/grid)**
>
> Responsive Grid System and Column Layout Based on Screen Size