# CSS Grid System

**URL:** <https://forum.pinegrow.com/t/css-grid-system/1971>\
**Category:** General\
**Created:** [June 15, 2018, 9:55am UTC](https://forum.pinegrow.com/t/css-grid-system/1971 "2018-06-15T09:55:10Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![red-rosefields](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/red-rosefields/32/5392_2.png) [@red-rosefields](https://forum.pinegrow.com/u/red-rosefields)\
**Post date:** [June 15, 2018, 9:55am UTC](https://forum.pinegrow.com/t/css-grid-system/1971/1 "2018-06-15T09:55:10Z")

</div>

Hello all, At my work are moving away from bootstrap (flexbox) in favor of CSS grid system. I know there is a lite basic support in PG on this technology mainly of some input fields . Do you think PG will fully suport this new technology with visual tools any time soon?  
Thanks

---

<div class="post-metadata">

**Author:** ![schpengle](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/schpengle/32/238_2.png) [@schpengle](https://forum.pinegrow.com/u/schpengle)\
**Post date:** [June 15, 2018, 9:07pm UTC](https://forum.pinegrow.com/t/css-grid-system/1971/2 "2018-06-15T21:07:06Z")

</div>

Hi there, this isn’t an answer for you _sorry_ but a question 🙂  
Why are they doing that then? what are the list of reasons and how much easier/more trouble is it making things to move away. Or is it better for future proofing and maintenance do they think.

mmm… that was a few questions. sorry

---

<div class="post-metadata">

**Author:** ![red-rosefields](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/red-rosefields/32/5392_2.png) [@red-rosefields](https://forum.pinegrow.com/u/red-rosefields)\
**Post date:** [June 15, 2018, 9:17pm UTC](https://forum.pinegrow.com/t/css-grid-system/1971/3 "2018-06-15T21:17:41Z")

</div>

I don’t know why are they doing this. I am just a junior designer in there. what I have understood so far is that this new css grid is easier to implement with less code and future prove… the technical detail i don’t know. It sucks becouse i was learning the logic behind flexbox system and now they want to go with css grid system… whaterver… Thanks

---

<div class="post-metadata">

**Author:** ![schpengle](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/schpengle/32/238_2.png) [@schpengle](https://forum.pinegrow.com/u/schpengle)\
**Post date:** [June 15, 2018, 9:34pm UTC](https://forum.pinegrow.com/t/css-grid-system/1971/4 "2018-06-15T21:34:25Z")

</div>

ah cheers for that.  
and don’t worry, keep learning Flexbox too!

They both work differerently and can be used together.

ie , one works like everything is on long line - no wrapping of elements so good for formatting one line/row at a time,  
the other treats the layout as a …grid! both Rows And Columns, at the same time.

they can be combined together to achieve great things 🙂

i.e.

> **[How to combine Flexbox and CSS grids for efficient layouts](https://getflywheel.com/layout/combine-flexbox-and-css-grids-for-layouts-how-to/)**
>
> Make your website layout beautiful and easy to navigate with this easy-to-follow how-to!

> **[When to use Flexbox : The Brolik Blog](http://brolik.com/blog/when-to-use-flexbox/)**
>
> The flexbox box layout is a great technological advancement on the web. In this article, I’ll share some tips on when to (and when not to) use flexbox with some Sass and jQuery for backwards compatibility.

and maybe some fun stuff/courses here too 🙂  
[https://hackernoon.com/the-ultimate-css-battle-grid-vs-flexbox-d40da0449faf](https://hackernoon.com/the-ultimate-css-battle-grid-vs-flexbox-d40da0449faf)

oh and of course, talking about fun, how on earth could I forget…

> **[Flexbox Froggy](http://flexboxfroggy.com)**
>
> A game for learning CSS flexbox

anyway, back to to your question… CSS GRID support in Pinegrow…?

---

<div class="post-metadata">

**Author:** ![red-rosefields](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/red-rosefields/32/5392_2.png) [@red-rosefields](https://forum.pinegrow.com/u/red-rosefields)\
**Post date:** [June 16, 2018, 10:41am UTC](https://forum.pinegrow.com/t/css-grid-system/1971/5 "2018-06-16T10:41:54Z")

</div>

Hey thank you very much for your time to write down that valuable info above. I will look at them for sure. I just started an udemy course on css grid system and yes it looks very powerful.  
Hope PG will support this new css feature.  
Thanks again

---

<div class="post-metadata">

**Author:** ![texxsmith](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/texxsmith/32/1201_2.png) [@texxsmith](https://forum.pinegrow.com/u/texxsmith)\
**Post date:** [June 16, 2018, 1:39pm UTC](https://forum.pinegrow.com/t/css-grid-system/1971/6 "2018-06-16T13:39:28Z")

</div>

First it was media queries and floats, then it was CSS Flex Box. Now Flex box is out of favor and CSS Grid is the new guy. CSS Grid seems simpler but truthfully I haven’t used it yet.  
I guess this is is enought browser support to start using it, right?

[https://caniuse.com/#feat=css-grid](https://caniuse.com/#feat=css-grid)

---

<div class="post-metadata">

**Author:** ![SureWeb](https://avatars.discourse-cdn.com/v4/letter/s/71e660/32.png) [@SureWeb](https://forum.pinegrow.com/u/SureWeb)\
**Post date:** [June 16, 2018, 10:00pm UTC](https://forum.pinegrow.com/t/css-grid-system/1971/7 "2018-06-16T22:00:34Z")

</div>

This is an excellent FREE course on CSS Grid 🙂

> **[CSS Grid](https://cssgrid.io)**
>
> Learn all about CSS Grid with Wes Bos in this free video series!

---

<div class="post-metadata">

**Author:** ![red-rosefields](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/red-rosefields/32/5392_2.png) [@red-rosefields](https://forum.pinegrow.com/u/red-rosefields)\
**Post date:** [June 17, 2018, 8:17am UTC](https://forum.pinegrow.com/t/css-grid-system/1971/8 "2018-06-17T08:17:31Z")

</div>

Nice,Thanks, enrolled. 🙂  
hope someone at PG could tell me CSS GRID support in Pinegrow…?

---

<div class="post-metadata">

**Author:** ![Emmanuel](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/emmanuel/32/6294_2.png) [@Emmanuel](https://forum.pinegrow.com/u/Emmanuel)\
**Post date:** [June 17, 2018, 10:50am UTC](https://forum.pinegrow.com/t/css-grid-system/1971/9 "2018-06-17T10:50:00Z")

</div>

Teaser: new things are coming soon about CSS GRID …

---

<div class="post-metadata">

**Author:** ![red-rosefields](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/red-rosefields/32/5392_2.png) [@red-rosefields](https://forum.pinegrow.com/u/red-rosefields)\
**Post date:** [June 17, 2018, 5:06pm UTC](https://forum.pinegrow.com/t/css-grid-system/1971/10 "2018-06-17T17:06:26Z")

</div>

Fantastic!! can’t wait to see this new things! Happy PG knows the way to get better and better. cheers

---

<div class="post-metadata">

**Author:** ![rich](https://avatars.discourse-cdn.com/v4/letter/r/35a633/32.png) [@rich](https://forum.pinegrow.com/u/rich)\
**Post date:** [June 17, 2018, 10:04pm UTC](https://forum.pinegrow.com/t/css-grid-system/1971/11 "2018-06-17T22:04:30Z")

</div>

I second that. I just completed the Wes Bos CSS Grid course. Its well done and very informative. I recommend it t anyone wanting to learn Grid.

---

<div class="post-metadata">

**Author:** ![matjaz](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/matjaz/32/5_2.png) [@matjaz](https://forum.pinegrow.com/u/matjaz)\
**Post date:** [June 18, 2018, 10:06am UTC](https://forum.pinegrow.com/t/css-grid-system/1971/12 "2018-06-18T10:06:42Z")

</div>

Yes, visual tools for CSS Grid are coming to PG soon. In my experience so far, CSS grid is really a game changer for designing web layouts. That said, flexbox is here to stay as well. Grid + Flex are a powerful and complementing combination. Grid defines the layout and Flex defines how elements stack within that layout.

 ![cssgrid](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/9/9f2fc87e27c4451025903fe41be03f31c952a12a.jpg)

---

<div class="post-metadata">

**Author:** ![red-rosefields](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/red-rosefields/32/5392_2.png) [@red-rosefields](https://forum.pinegrow.com/u/red-rosefields)\
**Post date:** [June 18, 2018, 11:46am UTC](https://forum.pinegrow.com/t/css-grid-system/1971/13 "2018-06-18T11:46:41Z")

</div>

WOW, that looks amazing! yes yes, Grid + Flex! win-win

---

<div class="post-metadata">

**Author:** ![schpengle](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/schpengle/32/238_2.png) [@schpengle](https://forum.pinegrow.com/u/schpengle)\
**Post date:** [June 18, 2018, 3:06pm UTC](https://forum.pinegrow.com/t/css-grid-system/1971/14 "2018-06-18T15:06:55Z")

</div>

!!!  
Holy cow.  
wow.

That’s taking things to the next level really.  
That alone would make Pinegrow appealing to those just trying to get to grips with CSS layouts, grid etc.  
Well done.

Good thing @red-rosefields asked about it now… pity it kind of bust your trumpet playing fanfare of a surprise delivery of it though, but awesome stuff.  
Well done 🙂

---

<div class="post-metadata">

**Author:** ![schpengle](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/schpengle/32/238_2.png) [@schpengle](https://forum.pinegrow.com/u/schpengle)\
**Post date:** [June 18, 2018, 4:35pm UTC](https://forum.pinegrow.com/t/css-grid-system/1971/15 "2018-06-18T16:35:50Z")

</div>

I noticed this , rather _retro_ looking site the other day too.  
seems an odd styling considering the subject matter 🙂  
me like!

[https://cssgrid.cc](https://cssgrid.cc)

AH yes, I think I might have posted that one the other day actually, it is the _CoffeCup_ Css grid building free app site

They also have some free themes using css grid and foundation and suchlike that you can use  
I will also post them in the freebies/deals sections

but here you go, its related to this too

[https://cssgrid.cc/themes/](https://cssgrid.cc/themes/)

---

<div class="post-metadata">

**Author:** ![eiwd](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/eiwd/32/1112_2.png) [@eiwd](https://forum.pinegrow.com/u/eiwd)\
**Post date:** [June 18, 2018, 7:50pm UTC](https://forum.pinegrow.com/t/css-grid-system/1971/16 "2018-06-18T19:50:54Z")

</div>

I tend to be wary of software by CoffeeCup as they love to get you hooked on something, spending sometimes hundreds of dollars only to never give you all the features and fixes they promise along the way. Then instead of doing the major upgrades and updates the software you purchased needs, they just create a new piece of software to take it’s place making you pay once again for something they promised to add/fix in the software they already had going. No win situation there as far as I’m concerned. Very unlike Pinegrow and a few others that I use now that are much more customer conscientious.

---

<div class="post-metadata">

**Author:** ![schpengle](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/schpengle/32/238_2.png) [@schpengle](https://forum.pinegrow.com/u/schpengle)\
**Post date:** [June 19, 2018, 11:45am UTC](https://forum.pinegrow.com/t/css-grid-system/1971/17 "2018-06-19T11:45:43Z")

</div>

oh thanks for that @eiwd, good to know. I just remember their name from a long time ago in my windows day and the free css tool looks fine. Good to know their approach though.

I do seem to remember trying out their _responsive web site builder_ or whatever it was before.  
much like you described.

I went with pinegrow 🙂

---

<div class="post-metadata">

**Author:** ![eiwd](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/eiwd/32/1112_2.png) [@eiwd](https://forum.pinegrow.com/u/eiwd)\
**Post date:** [June 19, 2018, 12:06pm UTC](https://forum.pinegrow.com/t/css-grid-system/1971/18 "2018-06-19T12:06:44Z")

</div>

No worries @schpengle, it’s a free tool and I’m sure it can be used for learning so it’s all good. Just warning for people actually thinking to spend money there. 🙂

---

<div class="post-metadata">

**Author:** ![Printninja](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/printninja/32/1181_2.png) [@Printninja](https://forum.pinegrow.com/u/Printninja)\
**Post date:** [June 20, 2018, 6:17am UTC](https://forum.pinegrow.com/t/css-grid-system/1971/19 "2018-06-20T06:17:39Z")

</div>

Wow. With this new addition, it would seem like multi-monitor support would be more beneficial than ever. More room to spread out the ever-growing number of palates and controls in Pinegrow. (hint, hint)

---

<div class="post-metadata">

**Author:** ![Piro](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/piro/32/39_2.png) [@Piro](https://forum.pinegrow.com/u/Piro)\
**Post date:** [June 22, 2018, 4:36pm UTC](https://forum.pinegrow.com/t/css-grid-system/1971/21 "2018-06-22T16:36:19Z")

</div>

I once bought their responsive website builder by mistake and asked immediately for a refund. Nope. Never got that. While I was an existing customer btw, because I bought also their form builder before. That form builder is good, but has some promotion links inside which I don’t like and have to remove every time.  
And for the website builder case: I got Pinegrow and never looked back.  
Well … just adding some milk to the coffee cup here, in case it could help someone.

[Next page](https://forum.pinegrow.com/t/css-grid-system/1971.md?page=2)
